1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | >

预览模式: 普通 | 列表

蓝色奥运皮肤下载

作者:dangbao 日期:2008-07-16

绿色清爽皮肤下载

作者:dangbao 日期:2008-06-03

顶级经典常用的CSS属性

作者:dangbao 日期:2008-05-29

div+css命名规则

作者:dangbao 日期:2008-01-13

单行向上翻屏滚动文字代码

作者:dangbao 日期:2008-08-28

此代码也比较实用，可用于滚动新闻或公告的使用._.

HTML代码

<style type="text/css">
a {text-decoration: none;}
</style>
<script>
var marqueeContent=new Array();   //滚动新闻
marqueeContent[0]='<font color="#0000CC">14:25 </font><a href=http://www.blueidea.com/updatelist.asp target=_blank class="f12red">小泉称若自民党在议会选举中失败</a><br>';
marqueeContent[1]='<font color="#0000CC">14:25 </font><a href=http://www.blueidea.com/updatelist.asp target=_blank class="f12red">布什发表广播讲话</a><br>';
marqueeContent[2]='<font color="#0000CC">14:25 </font><a href=http://www.blueidea.com/updatelist.asp target=_blank class="f12red">伊斯兰武装炸毁印控克什米尔铁路导致列车出轨</a><br>';
marqueeContent[3]='<font color="#0000CC">14:25 </font><a href=http://www.blueidea.com/updatelist.asp target=_blank class="f12red">布雷默：即使抓住了萨达姆也难以结束抵抗行动</a><br>';
var marqueeInterval=new Array();  //定义一些常用而且要经常用到的变量
var marqueeId=0;
var marqueeDelay=2000;
var marqueeHeight=18;
//接下来的是定义一些要使用到的函数
function initMarquee() {
    var str=marqueeContent[0];
    document.write('<div id=marqueeBox style="overflow:hidden;height:'+marqueeHeight+'px" onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\'startMarquee()\',marqueeDelay)"><div>'+str+'</div></div>');
    marqueeId++;
    marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay);
    }
function startMarquee() {
    var str=marqueeContent[marqueeId];
        marqueeId++;
    if(marqueeId>=marqueeContent.length) marqueeId=0;
    if(marqueeBox.childNodes.length==1) {
        var nextLine=document.createElement('DIV');
        nextLine.innerHTML=str;
        marqueeBox.appendChild(nextLine);
        }
    else {
        marqueeBox.childNodes[0].innerHTML=str;
        marqueeBox.appendChild(marqueeBox.childNodes[0]);
        marqueeBox.scrollTop=0;
        }
    clearInterval(marqueeInterval[1]);
    marqueeInterval[1]=setInterval("scrollMarquee()",20);
    }
function scrollMarquee() {
    marqueeBox.scrollTop++;
    if(marqueeBox.scrollTop%marqueeHeight==(marqueeHeight-1)){
        clearInterval(marqueeInterval[1]);
        }
    }
initMarquee();
</script>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

查看更多...

Tags: 单行向上滚动新闻单行向上滚动新闻翻屏滚动文字公告翻屏滚动文字公告

分类:兼容代码 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 5

一行内两列LI,一个LI内两列

作者:dangbao 日期:2008-08-27

这个标题可能有点绕口，不过你想你看了效果以后就会知道，相信很多人都用过这样的布局。这个效果用TABLE很好做，用LI来实现难点在于LI的宽度控制，太宽了就会回行，太窄了右列标题挤到了左面。而且li有背景，每隔8行需要有空层，HOHO，造成浏览器BUG的机率太大了，反复调试吧。下面是我自己调试出来的效果，起到抛砖引玉的效果，希望引起关注。

点击查看效果

查看更多...

Tags: 一行内两列LI 一行内两列LI 一个LI内两列一个LI内两列

分类:兼容代码 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 34

WEB2.0风格的photoshop按钮样式

作者:dangbao 日期:2008-08-27

载入方法：编辑>>预设管理器>>预设类型(样式)>>载入
点击下载

查看更多...

Tags: photoshop按钮样式 photoshop按钮样式 asl asl WEB2.0风格 WEB2.0风格

分类:重构资源 | 固定链接 | 评论: 1 | 引用: 0 | 查看次数: 23

层点击展开关闭运动缓冲效果

作者:dangbao 日期:2008-08-27

兼容FF的弹出效果，很棒，蓝色网友巨献。

HTML代码

<script type="text/javascript">
/*
    函数名称: Scroll
    Scroll(obj, h, s)
    参数说明:
        obj,[object]  id值或对象.     必需
          h,[height]  展开后的高度.   可选(默认为200px)
          s,[speed]   展开速度,值越小展开速度越慢. 可选(默认为1.2){建议取值为1.1到2.0之间[例如:1.17]}.
    函数返回值:
        true    展开(对象的高度等于展开后的高度)
        false   关闭(对象的高度等于原始高度)
*/
function Scroll(obj, h, s){
    if(obj == undefined){return false;}
    var h = h || 200;
    var s = s || 1.2;
    var obj = typeof(obj)=="string"?document.getElementById(obj):obj;
    var status = obj.getAttribute("status")==null;
    var oh = parseInt(obj.offsetHeight);
    obj.style.height = oh;
    obj.style.display = "block";
    obj.style.overflow = "hidden";
    if(obj.getAttribute("oldHeight") == null){
        obj.setAttribute("oldHeight", oh);
    }else{
        var oldH = Math.ceil(obj.getAttribute("oldHeight"));
    }
    var reSet = function(){
        if(status){
            if(oh < h){
                oh = Math.ceil(h-(h-oh)/s);
                obj.style.height = oh+"px";
            }else{
                obj.setAttribute("status",false);
                window.clearInterval(IntervalId);
            }
        }else{
            obj.style.height = oldH+"px";
            obj.removeAttribute("status");
            window.clearInterval(IntervalId);
        }
    }
    var IntervalId = window.setInterval(reSet,10);
    return status;
}
window.onload= function(){
    document.getElementById('detail').onclick = function(){
        Scroll('detail', 300, 1.3);
    }
    document.getElementById('text').onclick = function(){
        Scroll('text');
    }
}
</script>
</head>
<body>
<p id="detail" style="border:1px dashed #f00;">这是一个段落啦!!哇哈哈哈
点我一下下啦:)</p>
<div id="text" style="border:1px solid #0f0">Hello World!
你敢点我不  -_|||</div>
<button onclick="Scroll('text', 400, 1.2)">Hello World</button>
</body>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

查看更多...

Tags: 层展开关闭层展开关闭运动缓冲效果运动缓冲效果

分类:兼容代码 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 12

1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | >

Powered By PJBlog2 v2.7 Build 05 CopyRight 2005 - 2007, Dangbao's Blog xhtml | css

Processed in 0.156250 second(s) , 2 queries , Olympic Design By dangbao
备案中……