还是要首先引用JQ框架。 然后来看看效果：(连接添加不上)只能暂时看哈图片， 具体效果可参见我博客左方“My Box”中的“玩游戏”： 下面代码中有具体注释。 再来看看代码： 复制代码 代码如下: <div id="_gameinfo" style="width:158px; border:1px #FFC solid; background-color:#FFF; position:fixed; z-index:101; display:none;padding:1px;"> </div> <div id="thegameBox" style="text-align:center;"> <a href="javascript:;" alt="WASD键控制小女孩移动，方向键控制小男孩的移动，不同颜色的陷阱只能容纳不同颜色的人通过哦！" name="binghuoren">深林冰火人</a> <a href="javascript:;" alt="鼠标点击抓东西。" name="zhishangqiu">智商球3</a> <a href="javascript:;" alt="鼠标操作，移动鼠标控制机械手移动，点击左键释放磁吸力抓住货物。" name="yunshuchuan">船长的运输船</a> </div> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#thegameBox a").mousemove(function(ev){ var _Imgsrc="http://files.jb51.net/upload/201109/20110901202741350.jpg";//这里需要将元素name设置和你的图片名字一样 var _Ways=$(this).attr("alt");//获取当前鼠标指着的元素的alt $("#_gameinfo").show();//显示提示层 if(!ev){ev=window.event;};//检测是否为IE document.getElementById("_gameinfo").style.left=(ev.clientX+10)+"px";//设置提示信息left为鼠标的X轴距离+10px document.getElementById("_gameinfo").style.top=(ev.clientY+10)+"px";//设置提示信息top为鼠标的X轴距离+10px $("#_gameinfo").html('<img src="'+_Imgsrc+'" alt="" width="158" height="117" style="margin-bottom:3px;" /><br />'+'<font color="blue">操作方法：</font>'+_Ways+'');//给提示层里面添加内容并传入参数 }).mouseout(function(){ $("#_gameinfo").hide();//鼠标离开元素提示层隐藏 }) }) </script>

　　推荐阅读

　　Javascript继承机制的设计思想分享

我一直很难理解Javascript语言的继承机制。 　　它没有"子类"和"父类"的概念，也没有"类"（class）和"实例"（instance）的区分，全靠一种很奇特的"原型链"（prototype chain）模式，来实现继承。 　　我花了很多时>>>详细阅读

本文标题：jquery 简短几句代码实现给元素动态添加及获取提示信息

地址：http://www.17bianji.com/kaifa2/JS/24231.html

 1/2    1