急求淘宝滚动条代码？ - 淘宝美工论坛 - Powered by Discuz!
淘宝美工论坛
标题: 急求淘宝滚动条代码？
作者: 倾心银阁& & 时间:
标题: 急求淘宝滚动条代码？有哪位前辈有的，请分享一下，我用Dreamweaver做的代码，在本地能实现上下滚动，但一放到淘宝就不行了，求原因，求代码？急急急急
作者: Rain& & 时间:
代码发上来看看被.
作者: 浅吟轻唱& & 时间:
你看看 DW 做的代码 是不是 含有js代码& &就是javaScript&&
如果是这个&&那淘宝是屏蔽了的& & 放上去没效果很正常&&
作者: kang& & 时间:
不知道你求的是店招那种效果还是店铺公告，来我店里看看是哪种
作者: 倾心银阁& & 时间:
我需要的是这种效果，请问哪位有代码？急求啊
作者: kang& & 时间:
我需要的是这种效果，请问哪位有代码？急求啊
不知道我理解的对不对，是像网页一样可以往下拉和往右拉？
如果是的话，只要在模板的最外层的&div&的style中加入overflow:那么超出部分就是滚动条控制了
作者: 老邱& & 时间:
这个我在51自学看到过，俗称页中页是吧
作者: 老邱& & 时间:
http://www.51zxw.net/show.aspx?id=16617&cid=321ex8c 估计是这个连接，放在详情页的
作者: 倾心银阁& & 时间:
其实我在本地用Dreamweaver做是可以实现的，不知怎么放到淘宝上就不行了
作者: 倾心银阁& & 时间:
http://www.51zxw.net/show.aspx?id=16617&cid=321ex8c 估计是这个连接，放在详情页的
你的链接找不开哦！
作者: 倾心银阁& & 时间:
这是代码，麻烦帮我看看，谢谢
&div style=&overflow:width:200;height:100&&
&&&p&广州市行由生物科技有限公司 &/p&
&&&p&淘宝商城：&/p&
&&&p&淘宝店铺：&/p&
&&&p&阿里巴巴：.&/p&
&&&p&官方网站：&/p&
&&&p&&&/p&
&&&p&/item.htm?id=&/p&
&&&p&动态店招制作:/&/p&
作者: 老邱& & 时间:
你的链接找不开哦！
那我就没有办法了
作者: 倾心银阁& & 时间:
那我就没有办法了
&div style=&overflow:width:200;height:100&&
&&&p&广州市行由生物科技有限公司 &/p&
&&&p&淘宝商城：&/p&
&&&p&淘宝店铺：&/p&
&&&p&阿里巴巴：.&/p&
&&&p&官方网站：&/p&
&&&p&&&/p&
&&&p&/item.htm?id=&/p&
&&&p&动态店招制作:/&/p&
作者: kubada& & 时间:
/不知道你求的是店招那种效果还是店铺公告，来我店里看看是哪种 ...
我要这种的，怎么做呢
作者: 高荣& & 时间:
楼猪，问题解决了没啊。
作者: 倾心银阁& & 时间:
楼猪，问题解决了没啊。
作者: 请叫我红领巾& & 时间:
我需要的是这种效果，请问哪位有代码？急求啊
你在哪里看的&&直接按住鼠标左键，选中所有表格&&Ctrl+C复制即可
欢迎光临 淘宝美工论坛 (/)
Powered by Discuz! X3.2求个滚动图片的效果的思路，我实在想不出了。 - 经典论坛 - Powered by Discuz!
标题: 求个滚动图片的效果的思路，我实在想不出了。
作者: tangbao510& & 时间:
标题: 求个滚动图片的效果的思路，我实在想不出了。一个滚动图片的效果。往一个方向可以无限循环。如果只是这个效果 我可以做出来，但是如果下面有按钮 对应的图片就乱掉。我试过几种方法都没成功。给个思路吧
作者: Wivien& & 时间:
不知道楼主表达的是什么，很含糊
作者: tangbao510& & 时间:
Wivien 发表于
不知道楼主表达的是什么，很含糊
这个是我做的。
如果滚动到第四张图片 就会往回滚动到第一张&&我想要我的效果是 不用往回滚动到一张 而是继续往前滚动 滚动到第一张
作者: weiweidechui& & 时间:
这个好办滚动循环啊
作者: tangbao510& & 时间:
weiweidechui 发表于
这个好办滚动循环啊
是分两部分嘛 一部分是 滚动的图片 一部分是下面的索引按钮。图片部分可以好几种循环滚动的办法 但是如果和下面索引按钮联动 我就犯难了
作者: Wivien& & 时间:
tangbao510 发表于
/thread--1.html
这个是我做的。
如果滚动到第四张图片 就会往回滚动 ...
我用Firefox看的，貌似就是你要的效果
作者: Wivien& & 时间:
不是不是，我知道你想要的效果了
作者: supersylar& & 时间:
如果那样滚动你要两个相同的滚动图片部分
然后外面来一层把他们包上，滚动外层，并且判断当前显示的是第几张图。
如果第一个包里面的元素滚到第四个，复制一个相同的图片包append到第一个包后面，继续滚动外层。
这时候显示的是第二个包得第一个元素。然后删除第一个包。
等第二个包第四个时，在复制一遍append到后面，这样循环。
至于你说的按钮啥的 来个悬停的事件，悬停时候把计时器停了，等离开时候再重新计时循环。
不知道是不是你想要的答案。。。。
作者: zhangliblue& & 时间:
让按钮跟着图片一块滚
作者: czy520lw& & 时间:
楼主的意思是图片一直滚，朝一个方向一个一个的显示出来，但当点击到下面按钮比如现在显示的是第四个图片，点了第一个按钮，这时候就是朝相反方向移动三张图片，显示第一个图，不知道我解释的是不是。
作者: czy520lw& & 时间:
楼主的意思是图片一直滚，朝一个方向一个一个的显示出来，但当点击到下面按钮比如现在显示的是第四个图片，点了第一个按钮，这时候就是朝相反方向移动三张图片，显示第一个图，不知道我解释的是不是。
作者: supersylar& & 时间:
czy520lw 发表于
楼主的意思是图片一直滚，朝一个方向一个一个的显示出来，但当点击到下面按钮比如现在显示的是第四个图片， ...
恩，就按照两个部分来滚动。每次按索引，索引都对应这两个目标。
按照程序规则，当按索引的时候每次都显示后面那个，就能一直向前滚了呗。。
作者: tangbao510& & 时间:
supersylar 发表于
如果那样滚动你要两个相同的滚动图片部分
然后外面来一层把他们包上，滚动外层，并且判断当前显示的是第几 ...
我没有想过用两个包 这个可以是个思路 我来试下 清除定时器啥的 现在都已经搞好了
作者: & & 时间:
我刚来，随便看看
作者: biao166& & 时间:
一般的是将图片复制出来放在后面，当到了最后一张的时候，就滚动到复制出来的第一张上，如此循环即可
作者: xa148& & 时间:
3楼的就可以啊！！
作者: tangbao510& & 时间:
本帖最后由 tangbao510 于
17:25 编辑
biao166 发表于
一般的是将图片复制出来放在后面，当到了最后一张的时候，就滚动到复制出来的第一张上，如此循环即可
这个方法的话 我已经做出来了 但索引按钮会和图片不对应了
作者: hemin007& & 时间:
怎么乱掉，怎么个对应不上?
作者: 54173cn& & 时间:
本帖最后由 54173cn 于
11:49 编辑
楼主说的淘宝商城焦点图的那个效果，自动播放最后一张图时还向右滚动那块我没做出来
作者: tangbao510& & 时间:
<font color="#173cn 发表于
楼主说的淘宝商城焦点图的那个效果，我上次没做出来
刚才去淘宝商城看了下 确实是这个效果
作者: 54173cn& & 时间:
tangbao510 发表于
刚才去淘宝商城看了下 确实是这个效果
八楼的想法可行，咱们再研究研究。
我当时想的是在第五张图完成时，给第五张图后复制第一张图（只负责滚动期间的显示），滚动完成后就直接显示第一张图，因为它们俩一样，所以看不出来。
但是当时没成功。
作者: tangbao510& & 时间:
<font color="#173cn 发表于
八楼的想法可行，咱们再研究研究。
我当时想的是在第五张图完成时，给第五张图后复制第一张图（只负责滚 ...
如果不考虑索引按钮 可以直接在滚动到最后一张之后 把第一张插到最后，可以循环。但这个时候 原先的第一张就是第五张了。所以这个时候再点击第一个索引按钮的时候就出现的是第五张
作者: 54173cn& & 时间:
本帖最后由 54173cn 于
13:45 编辑
tangbao510 发表于
如果不考虑索引按钮 可以直接在滚动到最后一张之后 把第一张插到最后，可以循环。但这个时候 原先的第一张 ...
不用考虑索引按钮，因为索引按钮是在网页刚加载时生成的，与前五个一一对应（我的例子有五张图）
你的想法要么就把所有的图片都复制到后面去才行。你看淘宝是暂时复制到后面的。
作者: slash1989& & 时间:
提示: 作者被禁止或删除。
作者: yjxf8285& & 时间:
&&我刚刚写的一个
作者: croyg& & 时间:
Mtime的这个页面滚动效果比较好！
作者: tangbao510& & 时间:
本帖最后由 tangbao510 于
20:09 编辑
终于写出个大概了 请帮测试
&!DOCTYPE html PUBLIC &-//W3C//DTD XHTML 1.0 Transitional//EN& &http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&&
&html xmlns=&http://www.w3.org/1999/xhtml&&
&meta http-equiv=&Content-Type& content=&text/ charset=utf-8& /&
&title&无标题文档&/title&
&script type=&text/javascript& src=&/ajax/libs/jquery/1.6.4/jquery.min.js&&&/script&
&style type=&text/css&&
ul{list-style:margin:0;padding:0;}
li{float:}
.Xing_focus{width:810 height:800overflow:border:1 position:}
.Xing_focus .imgs{width:3240 position:left:0}
.bnt {float:width:300height:20border:1 position:top:450left:100}
.bnt li{width:18height:18background: cursor:margin-right:10float:}
.bnt .sli{background:}
.next{width:100height:100background:#990000;float: cursor: position:top:500left:210}
.prev{width:100height:100background:#009;float:cursor:margin-right:30 position:top:500left:100}
&div class=&Xing_focus& id=&box&&
&ul class=&bnt& id=&bnt&&
&ul class=&imgs& id=&actor&&
&li class=&list1&&&img src=&.cn/brandsite/img/centuryImages/scroll_1_1.jpg& /&&/li&
&li class=&list2&&&img src=&.cn/brandsite/img/centuryImages/scroll_1_2.jpg& /&&/li&
&li class=&list3&&&img src=&.cn/brandsite/img/centuryImages/scroll_1_3.jpg& /&&/li&
&li class=&list4&&&img src=&.cn/brandsite/img/centuryImages/scroll_1_4.jpg& /&&/li&
&div class=&next&&&/div&
&div class=&prev&&&/div&
&script type=&text/javascript&&
$(window).load(function(){
var liW = $(&#actor li:first&).width();
var liL = $(&#actor li&).
////////////////////////////////////////////////////////////////////////////////////
for(i=0;i&liL;i++){
$(&#bnt&).append(&&li&&/li&&)
$(&#bnt li:first&).addClass(&sli&);
////////////////////////////////////////////////////////////////////////////////////
$(&#bnt li&).each(function(index) {
$(this).click(function(){
if($(&#actor&).is(&:animated&)==false){
if($(&#actor li:first&).css(&position&)==&relative&){
$(&#actor li:first&).css(&position&,&static&);
$(&#actor li:first&).css(&left&,&0px&);
$(&#actor li:first&).removeAttr(&style&);
$(&#actor&).animate({&left&:-index*liW},300,function(){
$(&#bnt li&).removeClass(&sli&);
$(&#bnt li&).eq(index).addClass(&sli&);
////////////////////////////////////////////////////////////////////////////////////
$(&.next&).click(function(){
autoScroll();
$(&.prev&).click(function(){
////////////////////////////////////////////////////////////////////////////////////
settime=window.setInterval(autoScroll,1000);
$(&#box&).hover(function(){
window.clearInterval(settime);
},function(){
settime=window.setInterval(autoScroll,1000);
////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////
function autoScroll(){
var ulL = parseInt($(&#actor&).css(&left&));
var liW = $(&#actor li:first&).width();
var liL = $(&#actor li&).
var ulW = $(&#actor&).width();
if($(&#actor&).is(&:animated&)==false){
if(ulL==-(liL-1)*liW&&$(&#actor li:first&).css(&position&)!=&relative&){
$(&#actor li:first&).css(&position&,&relative&);
$(&#actor li:first&).css(&left&,ulW+&px&);
$(&#actor&).animate({&left&:ulL-liW+&px&},300,function(){
var ulL = parseInt($(&#actor&).css(&left&));
var liW = $(&#actor li:first&).width();
var num = -ulL/liW
$(&#bnt li&).removeClass(&sli&);
$(&#bnt li&).eq(num).addClass(&sli&);
if(ulL==-(liL-1)*liW){
$(&#actor li:first&).css(&position&,&relative&);
$(&#actor li:first&).css(&left&,ulW+&px&);
else if(ulL==-liW*liL){
$(&#actor li:first&).css(&position&,&static&);
$(&#actor li:first&).removeAttr(&style&);
$(&#actor li:first&).css(&left&,&0&);
$(&#actor&).css(&left&,&0&);
$(&#bnt li&).removeClass(&sli&);
$(&#bnt li&).eq(0).addClass(&sli&);
function prev(){
if($(&#actor&).is(&:animated&)==false){
var ulL = parseInt($(&#actor&).css(&left&));
var ulW = parseInt($(&#actor&).width());
var liW = $(&#actor li:first&).width();
var liL = $(&#actor li&).
if(ulL==0&&$(&#actor li:last&).css(&position&)!=&relative&){
$(&#actor li:last&).css(&position&,&relative&);
$(&#actor li:last&).css(&left&,-ulW+&px&);
else if($(&#actor li:first&).css(&position&)==&relative&){
$(&#actor li:first&).css(&left&,&0px&);
$(&#actor li:first&).css(&position&,&static&);
$(&#actor li:first&).removeAttr(&style&);
$(&#actor&).animate({&left&:ulL+liW+&px&},300,function(){
var ulL = parseInt($(&#actor&).css(&left&));
var liW = $(&#actor li:first&).width();
var num = -ulL/liW;
$(&#bnt li&).removeClass(&sli&);
$(&#bnt li&).eq(num).addClass(&sli&);
if($(&#actor li:last&).css(&position&)==&relative&){
$(&#actor li:last&).css(&left&,0+&px&);
$(&#actor li:last&).css(&position&,&static&);
$(&#actor li:last&).removeAttr(&style&);
$(&#actor&).css(&left&,-(liL-1)*liW+&px&);
&提示：您可以先修改部分代码再运行
作者: 54173cn& & 时间:
tangbao510 发表于
终于写出个大概了 请帮测试
谢谢大家的讨论，淘宝的效果我做出来了。
显示得一模一样，但是方法不太一样。淘宝在最后时刻把第一张图定位到最后了，我是复制到最后，然后再删除。其实也不用删除，但是它是做为一个函数整体调用的，我觉得还是让它不要产生多余的东西比较好控制，需要的时候再让它复制。
作者: massage99& & 时间:
是不是轮播广告
作者: yjxf8285& & 时间:
<font color="#173cn 发表于
谢谢大家的讨论，淘宝的效果我做出来了。
/blog/wp-content/uploads/2011/jquery/fo ...
淘宝的那个效果 亮点在于从1切换到6的时候直接切换而不经过2-5这几张图片。
作者: 54173cn& & 时间:
yjxf8285 发表于
淘宝的那个效果 亮点在于从1切换到6的时候直接切换而不经过2-5这几张图片。
其实你做的那个效果是这样的，淘宝的1-5是要经过中间图片的。直接切换仅限于自动播放到最后一张切第一张的时候。
你那样的比淘宝的看着要更高级点。
作者: wangxiaoran& & 时间:
这真是个好论坛啊，能够真正大家互相帮助互相交流的论坛，每次工作困了来到这个论坛我就马上来精神了。
作者: & & 时间:
楼主的意思是图片一直滚，朝一个方向一个一个的显示出来，但当点击到下面按钮比如现在显示的是第四个图片，点了第一个按钮，这时候就是朝相反方向移动三张图片，显示第一个图，不知道我解释的是不是。
作者: & & 时间:
这个我不知道啊
欢迎光临 经典论坛 (/)
Powered by Discuz! X3.2Discuz论坛首页滚动图片代码_中华文本库
第1页/共7页
效果演示：
&table width="100%" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#000000" id="table13369"&
&td width="25%" valign="middle"&&b&&a target="_blank" href="/forum-26-1.html"&
&div align="center"&&span style="vertical-align: middle"&520PS潮流&/span&&/div&&/a&&/b&&/td&
&td width="25%" align="center"&&b&&a target="_blank" href="/viewthread.php?tid=45&extra=page%3D1"&
&div align="center"&
&span style="vertical-align: middle"&&font color="#FF0000"&◢免费学习PS报名◣&/font&&/span&&/div&&/a&&/b&&/span&&/div&&/td&
&td width="25%" align="center"&&b&&a target="_blank" href="/forum-13-1.html"&
&div align="center"&&span style="vertical-align: middle"&PS优秀教程&/span&&/div&&/a&&/b&&/td&
&td width="25%" align="center"&&b&
&a target="_blank" href="/forum-46-1.html"&
&div align="center"&
&span style="vertical-align: middle"&&font color="#FF0000"&PS素材下载
&td align="center" valign="middle"&&b&&a target="_blank" href="/forum-58-1.html"&
&div align="center"&&span style="vertical-align: middle"&PSD下载
第1页/共7页
寻找更多 ""网站制作想做一个滚动图片，下面有12345页码，可点击，页码旁边有文字超链接，同求代码，谢谢了~_百度知道
网站制作想做一个滚动图片，下面有12345页码，可点击，页码旁边有文字超链接，同求代码，谢谢了~
最终样式如图所示，网站布局已经做好了，把这个放进去就能完成了，谢谢了
hiphotos，我定加，马上补上.代码或flash可直接放入div和/div中间.jpg" esrc="http，若需要flash等其他东西可发我邮箱里。<img class="ikqb_img" src="http.baidu。一着急忘了给分了，网页制作新人，望大家多帮助一下我.hiphotos，dragonnosea@sina，自己选择要查看的图片.com/zhidao/wh%3D600%2C800/sign=b504fc2a20ab803d5edcb29/d6ca7bcb0a46f21fa6b600c33ae97://h.hiphotos。挺着急的
提问者采纳
这个叫做5张换图，我已经发到你邮箱了，记得给分哦~
提问者评价
其他类似问题
为您推荐：
页码的相关知识
其他3条回答
这种程序多的很，百度上搜索，图片切换代码，一堆
&!DOCTYPE html PUBLIC &-//W3C//DTD XHTML 1.0 Transitional//EN& &http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&&
&html xmlns=&http://www.w3.org/1999/xhtml&&
&meta http-equiv=&Content-Type& content=&text/ charset=gb2312& /&
&title&图片跳转&/title&
function show(){
for(i=1;i&=4;i++){
document.getElementById(i).style.display=&none&;
document.getElementById(i).style.display=&block&;
setTimeout(&show()&,1000);
&body onload=&show()&&
&img src=&../images/images/adv/adv_2.jpg& id=&1& style=&display:block& /&
&img sr...
朋友让我赚点分 啊？
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁图片循环流动的代码，但图片只滚动不循环？求解答！
[问题点数：80分]
图片循环流动的代码，但图片只滚动不循环？求解答！
[问题点数：80分]
不显示删除回复
显示所有回复
显示星级回复
显示得分回复
只显示楼主
匿名用户不能发表回复！|
每天回帖即可获得10分可用分！小技巧：
你还可以输入10000个字符
(Ctrl+Enter)
请遵守CSDN，不得违反国家法律法规。
转载文章请注明出自“CSDN（www.csdn.net）”。如是商业用途请联系原作者。}