为了账号安全,请及时绑定邮箱和手机立即绑定

怎么把网页元素转为jquery对象

怎么把网页元素转化为jquery对象 $(imgAll[imgArrIndex][i]); 出错了?

正在回答

3 回答

91,99行,你把length写错

96,97行,你把rotate写错

0 回复 有任何疑惑可以回复我~
#1

yangli_omg

还有98行,逗号改为点。改完应该能运行了
2016-04-14 回复 有任何疑惑可以回复我~

我的不行呀,我的是jquery-1.7.2.min.js版本的,我的代码和老师一样的,就是不能运行,好难过

// JavaScript Document
var loopPlayerInit=(function(){
	var $butLeft=null,
		$butRight=null,
		$butPlay=null,
		$imgList=null,
		origin=['125px','600px'],
		imgOrigin=['125px','800px'],
		imgAll=createImg([['img/1.jpg','img/2.jpg','img/3.jpg','img/4.jpg'],['img/5.jpg','img/6.jpg','img/7.jpg','img/8.jpg'],['img/9.jpg','img/10.jpg','img/11.jpg','img/12.jpg']]),
		imgArrIndex=0,
		imgAng=45,
		imgTime=300,
		rotating=false,
		autoTimer=null,
		autointerval=3000;
	//初始化
	function init(){
		$butLeft=$(".butLeft"),
		$butRight=$(".butRight"),
		$butPlay=$(".butPlay"),
		$imgList=$(".mainBox ul li");
		//倾斜图片
		configer();
		//事件添加函数
		setEvent();
	}
	//倾斜图片
	function configer(){
		var ang=5,
		 	aint=-5;
		$imgList.transform({origin:origin});
		$imgList.each(function(i){
		   var $this=$(this);
		   $this.transform({rotate:aint+i*ang+"deg"})
		
		})
	}
	//事件添加函数
	function setEvent(){
		$butLeft.bind('click',function(){
			anigo(-1);
			return false;
		});
		$butRight.bind('click',function(){
			anigo(1);
			return false;
		});
		$butPlay.bind('click',function(){
			var play="play",
				pause="pause",
				$but=$(this);
			if($but.text()=="play"){
				$but.text(pause);
				autoGo();
			}else{
				$but.text(play);
				autoStop();
			}
			return false;
		});
	}
	//创建图片
	function createImg(arr){
		var imgArr=[];
		for(var i in arr){
			imgArr[i]=[];
			for(var j in arr[i]){
				imgArr[i][j]=new Image();
				imgArr[i][j].src=arr[i][j];
			}
		}
		return imgArr;
	}
	//旋转改变图片
	function anigo(d){
		//alert(imgArrIndex);
		if(rotating)return false;
		rotating=true;
		imgArrIndex+=d;
		if(imgArrIndex>imgAll.length-1){
			imgArrIndex=0;
		}else if(imgArrIndex<0){
			imgArrIndex=imgAll.length-1;
		}
		//alert(imgArrIndex);
		$imgList.each(function(i){
			var $thisItem=$(this);
			var $thisImg=$thisItem.children("img");
			var $targetImg=$(imgAll[imgArrIndex][i]);
			var thisTime=(d===1)?imgTime*i:imgTime*($imgList.lenth-1-i);
			$thisItem.append($targetImg);
			$thisImg.transform({origin:imgOrigin});
			$targetImg.transform({origin:imgOrigin,rotate:(0-d)*imgAng+'deg'});
			setTimeout(function(){
				$thisImg.animate({roate:imgAng*d+'deg'});
				$targetImg.animate({roate:'0deg'},500,function(){
					$thisImg,remove();
					if(thisTime===(imgTime*($imgList.lenth-1))){
						rotating=false;
					}
				});
			},thisTime);
		})
	}
	//自动播放
	function autoGo(){
		clearInterval(autoTimer);
		anigo(1);
		autoTimer=setInterval(function(){
			anigo(1);
		},autointerval);
	}
	//播放停止
	function autoStop(){
		clearInterval(autoTimer);
	}
	return init;
})();
loopPlayerInit();
/*$(function(){
//$("#test1").transform({rotate:"60deg"});
$("#test1").animate({rotate:"60deg"});
})

var a=0;

var b=setInterval(function(){
	console.log(a++);
	
	if(a>5)	clearInterval(b);

	},1000);//间隔多少毫秒调用函数,不会停止,除非调用调用了clear;
	
setTimeout(function(){
	alert("v");
	},1000);//延迟多少毫秒,调用函数,只会执行一次。
	*/


0 回复 有任何疑惑可以回复我~

直接用$()  把一个原生的dom节点包一下,就可以转成jquery对象,jquery文件需要引入到页面。如果你的jquery文件引入了,那就是 imgAll[imgArrIndex][i]不是一个节点元素。如还有问题帖上完整代码。

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
Jquery插件transform旋转焦点图
  • 参与学习       31547    人
  • 解答问题       63    个

本视频教程教你制作带旋转效果的焦点图轮播器,结合案例学的更快

进入课程

怎么把网页元素转为jquery对象

我要回答 关注问题
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号