收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 1367|回复: 0

请教下这个点击切换和不点击自动切换的JS该怎么写呢?

[复制链接]
发表于 2011-1-18 14:46:16 | 显示全部楼层 |阅读模式
布局如图:
1212.gif

主要想实现:
1、点击下面的“一”或“二”时,上面部分对应的LI切换,一共是6个LI,3个一组。
2、不点击时,那两组LI就隔几秒钟自动切换

哪位高手帮帮忙啊,万分感谢

css部分代码:
*{ margin:0; padding:0;}
.all{ width:635px; float:left; height:262px;}
.all_con{ width:635px; height:240px; position:relative; overflow:hidden; margin-left:5px; margin-top:2px;}
.all_con ul{ width:20000em; position:absolute; top:0; left:0;}
.all_con ul li{ float:left; padding-right:4px;}
.all_con ul li a{ background:#ccc; width:202px; height:229px; display:block; padding:8px 0 0 8px; position:relative;}
.all dl{ padding:2px 0 0 8px;}
.all dl dd{color:#000;float:left; margin-right:9px;}
.all dl dd.active{color:#cc0000;

页面部分代码:

<div class="all">
        <div class="all_con">
          <ul style="left: -642px;">
            <li title="1"><a href="#" target="_blank"><b>第一张</b></a></li>
<li title="2"><a href="#" target="_blank"><b>第二张</b></a></li>
<li title="3"><a href="#" target="_blank"><b>第三张</b></a></li>
<li title="4"><a href="#" target="_blank"><b>第四张</b></a></li>
<li title="5"><a href="#" target="_blank"><b>第五张</b></a></li>
<li title="6"><a href="#" target="_blank"><b>第六张</b></a></li>
          </ul>
        </div>
        <dl><dd>一</dd><dd class="active">二</dd></dl>
      </div>

[[i] 本帖最后由 blue77 于 2011-1-18 14:53 编辑 ]
您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-12-5 13:01 , Processed in 0.124683 second(s), 11 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表