
正文
jquery幻灯代码,jQuery代码
提示:扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
jquery幻灯片
这个效果就是虾米站长网首页那个左右滚动那个效果,我先把代码发给你,如果还有问题再追问吧:
$(".goleft").click(function () {
var $self = $(this).siblings(".scrollcon").children("ul");
var lineWidth = $self.find("li:last").outerWidth(true);
!$self.is(":animated")($self.css({"marginLeft":-lineWidth+"px"}).find("li:last").prependTo($self),$self.animate({"marginLeft":0 +"px"}, 600));
});
$(".goright").click(function(){
var $self = $(this).siblings(".scrollcon").children("ul");
var lineWidth = $self.find("li:first").outerWidth(true);
!$self.is(":animated")$self.animate({ "marginLeft" : -lineWidth +"px" }, 600, function(){$self.css({"marginLeft":0 +"px"}).find("li:first").appendTo($self);});
});
//这是虾米站长网的网址:, 你可以先看一下里面的那个效果,如果还不懂,再问我吧。
相关问答
Q1: jquery幻灯片轮播代码怎么写
jQuery轮播直接上插件,
引入插件js,在页面中定义相关参数即可。
----
搜索jquery轮播插件,找个好看的下载,参考修改下就好
Q2: jquery 轮播图幻灯片代码,轮播的同时改变父级模块的背景色
思路:可以在每张图片上添加自定义属性,此时的自定义属性用来存放背景色。当前图片轮播到后获取这个自定义属性值,给parent设置背景色即可!
Q3: Jquery幻灯片特效代码分享--打开页面随机选择切换方式(3)
这篇文章主要介绍了jQuery实现幻灯片焦点图,可实现非常炫目时尚的幻灯片效果,非常具有实用价值,基本能满足你在网页上使用幻灯片(焦点图)效果,需要的朋友可以参考下
幻灯片效果描述:与前两节不同的是,这款特效可以打开页面随机选择切换方式(方向)
运行效果截图如下:
具体代码如下
head
meta
http-equiv="Content-Type"
content="text/html;
charset=gb2312"
/
titleJquery幻灯片焦点图插件/title
script
src="js/jquery-1.4a2.min.js"
type="text/javascript"/script
script
src="js/jquery.-1.2.1.min.js"
type="text/javascript"/script
script
type="text/javascript"
//打开页面随机选择
切换方式(方向),怕增大KinSlideshow.js文件
就没把随机切换写到里面。
//使用时如有需要随机自己写在前面是一样的。而且还可以只固定随机切换哪几种。
var
moveStyle
var
rand
=parseInt(Math.random()*4)
switch(rand){
case
0:
moveStyle="left"
;break;
case
1:
moveStyle="right"
;break;
case
2:
moveStyle="down"
;break;
case
3:
moveStyle="up"
;break;
}
$(function(){
$("#KinSlideshow1").KinSlideshow({moveStyle:moveStyle});
})
/script
style
type="text/css"
#KinSlideshow{
overflow:hidden;
width:600px;
height:300px;}
/style
/head
body
h2打开页面随机选择切换方式(方向)---刷新看看
^_^/h2
div
id="KinSlideshow1"
style="visibility:hidden;"
a
target="_blank"img
src="images/11.png"
alt="Jquery幻灯片焦点图插件"
width="600"
height="300"
//a
a
target="_blank"img
src="images/23.png"
alt="Jquery幻灯片焦点图插件"
width="600"
height="300"
//a
a
target="_blank"img
src="images/4.jpg"
alt="Jquery幻灯片焦点图插件"
width="600"
height="300"
//a
a
target="_blank"img
src="images/5.jpg"
alt="Jquery幻灯片焦点图插件"
width="600"
height="300"
//a
a
target="_blank"img
src="images/22.png"
alt="Jquery幻灯片焦点图插件"
width="600"
height="300"
//a
/div
/body
/html
希望本文所述对大家的Jquery特效设计有所帮助。







