例子 1 、品牌列表 需要一张小图片,还有 jqurey1.3.1 的 js 包
下载地址: jqurey鼠标经过例子 http://xiazai.jb51.net/200907/yuanma/jquery_mouse">

Heim  >  Artikel  >  Web-Frontend  >  jqurey 学习笔记 传智博客佟老师附详细注释_jquery

jqurey 学习笔记 传智博客佟老师附详细注释_jquery

WBOY
WBOYOriginal
2016-05-16 18:50:081207Durchsuche

1 、写 js 的时候用 aptana ( IDE ),有 jquery 的代码提示。
 
把 code assist 里面的 jqurey1.3 选上就可以了。

2 、为一个元素增加事件的时候不要在 html 里加,在 js 中加。
不要写
要写成: document.getElementById(“id”).onclick = function(){}

3 、把 js 剥离出来,做到 html 和 js 的分离。
Html 中除了引入 js 之外,不要别的 js 代码。

4 、 Jqurey 选择器:基本选择器、层级选择器、基本过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过滤选择器、表单选择器、表单对象属性选择器
http://xiazai.jb51.net/200907/yuanma/jQuery_xuanzeqi.rar

5 、选择器中的空格问题

带空格的是子选择器,不带空格的是可见性过滤选择器

例子 1 、品牌列表 需要一张小图片,还有 jqurey1.3.1 的 js 包
下载地址: jqurey鼠标经过例子 http://xiazai.jb51.net/200907/yuanma/jquery_mouse.rar
代码:
复制代码 代码如下:















例子 2 、超链接和图片提示效果 需要几张图片 jqurey1.3.1 的 js 包
代码
复制代码 代码如下:





Untitled Document


";// 创建一个 div
$("body").append(im);// 把创建的 div 追加到 body 中
// 设定追加的 div 的位置, e 是鼠标的位置,再加上距离鼠标的位置 ,就是 div 的位置
$("#tooltip").css("left", e.pageX + x + "px")
.css("top", e.pageY + y + "px")
.show("fast");// 显示 速度设为 快
}).mouseout(function(){// 鼠标移出事件的方法
this.title = this.myTitle;// 把 myTitle 还给 title
$("#tooltip").remove();// 删除新添加的 div
}).mousemove(function(e){// 鼠标在图片上移动的事件的方法
// 修正位置
$("#tooltip").css("left", e.pageX + x + "px")
.css("top", e.pageY + y + "px");
}).click(function(){return false;});// 取消 a 标记的默认方法
})



有效果:



  •  苹果 iPod

  •  苹果 iPod nano

  •  苹果 iPhone

  •  苹果 Mac












无效果:



  •  苹果 iPod

  •  苹果 iPod nano

  •  苹果 iPhone

  •  苹果 Mac




Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn