jQuery $this.index() 使用案例

jQuery $this.index() 使用案例

JQueryqingyu2020-10-31 11:52:451102A+A-

  jQuery $this.index() 使用案例

  案例:

  淘宝服服饰精品案例分析

jQuery $this.index() 使用案例

  1. 核心原理:排他思想,鼠标经过左侧盒子的某个li 就让内容区域的盒子相对应图片显示,其余图片隐藏。

  2. 需要得到当前小li索引号,就可以显示对应索引号的图片。

  3. jQuery得到当前元素索引号$this.index()

  4. 中间对应的图片,可以通过eq(index)方法去选择

  5. 显示元素(show) 隐藏元素hide()

$(function(){
			//1.鼠标经过左侧的小<li>
			$("#left li").onmouseover(function(){
			//2.得到当前小li索引号
			var index = $(this).index();
			//3.让右侧的盒子相应索引号显示
			$("content div").eq(index).show();
			//4.让其余的图片隐藏
			$("content div").eq(index).sibings().hide();
			})
		})
点击这里复制本文地址 欢迎来到大黄鸡源码分享网
qrcode

大黄鸡源码编程网 © All Rights Reserved.  
网站备案号:闽ICP备18012015号-4
Powered by Z-BlogPHP
联系我们| 关于我们| 广告联系| 网站管理