选项卡滚动

最新推荐文章于 2024-03-04 16:01:13 发布

Hiirhan

最新推荐文章于 2024-03-04 16:01:13 发布

阅读量337

点赞数

分类专栏： .net 文章标签： function scroll float javascript xhtml url

本文链接：https://blog.csdn.net/wzx_it/article/details/5325836

版权

.net 专栏收录该内容

32 篇文章 0 订阅

订阅专栏

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>滚动Tab-www.codefans.net</title>
<style type="text/css">
div#box{
    float:left;
    }
div#box span{
    display:block;
    cursor:pointer;
    width:24px;
    height:24px;
    }
div#box span#left{
    float:left;
    background:transparent url(http://mat1.qq.com/mini2009/images/youhua/all2008.gif) no-repeat scroll left -82px;
    }
div#box span#right{
    float:left;
    background:transparent url(http://mat1.qq.com/mini2009/images/youhua/all2008.gif) no-repeat scroll -384px -82px;
    }
div#qqmini{
    float:left;
    width:345px;
    overflow:hidden;
    }
ul{
    margin:0px;
    float:left;
    width:9999px;
    overflow:hidden;
    margin-left:-2.5em;
    *margin-left:-1px;
    }
li{
    list-style-type:none;
    float:left;
    background:transparent url(http://mat1.qq.com/mini2009/images/youhua/all2008.gif) no-repeat scroll 0 -31px;
    width:69px;
    height:18px;
    padding-top:5px;
    text-align:center;
    cursor:pointer;
    }
</style>
</head>
<body>
<div id="box">
<span id="left"><a href="javascript:void(0)"></a></span>
<div id="qqmini">
<UL>
    <LI>新闻</LI>
    <LI>财经</LI>
    <LI>娱乐</LI>
    <LI>体育</LI>
    <LI>汽车</LI>
    <LI>读书</LI>
    <LI>博客</LI>
    <LI>游戏</LI>
</UL>
</div>
<span id="right"><a href="javascript:void(0)"></a></span>
</div>
<script type="text/javascript">
function $(e){
    return    typeof e == 'string'?document.getElementById(e):e;
    }
var Event={
    add:function (obj,EventType,fn){
    if (obj.attachEvent){
        obj['e'+EventType+fn] = fn;
        obj[EventType+fn] = function() {obj['e'+EventType+fn](window.event);}
        obj.attachEvent('on'+EventType,obj[EventType+fn]);
        }else if(obj.addEventListener){
            obj.addEventListener(EventType,fn,false);
            }else    {
                obj['on'+EventType]=fn;
                }
    }
    ,
    remove:function(obj,EventType,fn){
    if (obj.detachEvent){
        obj.detachEvent('on'+EventType,obj[EventType+fn]);
        }else if(obj.removeEventListener){
            obj.removeEventListener(EventType,fn,false);
            }else    {
                obj['on'+EventType]=null;
                }

    }
}
function set(l,r,c,offset){
    Event.add(l,'click',function (){c.scrollLeft-=offset});
    Event.add(r,'click',function (){c.scrollLeft+=offset});
    }
set($('left'),$('right'),$('qqmini'),69);
</script>
</body>
</html>

Hiirhan

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
选项卡滚动

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">head>meta http-equiv="Content-Type" con
复制链接

扫一扫