플러그인을 배워서 직접 만들었어요. 렌더링은 다음과 같습니다. 코드는 다음과 같습니다. <title>제목 없는 페이지</title> <style type="text/css"> #conBox{ position:absolute; width:200px;padding:5px;display:none;background:#666;z-index:999;border-radius:5px;} </style> <span class="ll" title="123"> </span>안녕하세요<a title="123" href="#"> </a>4대 납품<a title="123" href="#"> </a>12331<a title="123" href="#"> </a>12331<a title="123" href="#"> </a>12331<a title="123" href="#"> </a>12331<a title="123" class="ll" href="#"> </a>토너 1개<a title="123" href="#"> </a>1사탄의 법칙 1<a title="123" href="#"> </a>12사탄법1<a title="123" href="#"></a>12331<a title="123" href="#"> </a>12331<a title="123" href="#"> </a>12331<a title="123" class="ll" href="#"> </a>12331<div> </div> [Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다. ] $(function(){ //插件主题 $.fn.extend({ showTitle:function(){ $('<div id="conBox">').appendTo('body'); var d=$("#conBox"); this.bind({ mouseover:function(){ if(!$("#conBox")){ $('<div id="conBox">').appendTo('body'); }else{ d=$("#conBox"); } var of=$(this).offset(); var title=$(this).attr("title"); //定义位置 d.css({top:of.top+$(this).height()+"px",left:$(this).width()/2+of.left+"px"}).text($(this).attr("title")); //显示 d.fadeIn(); }, mouseout:function(){ //鼠标一走隐藏 d.fadeOut(); } }); } }); //调用 $(".ll").showTitle(); });
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
