网页左侧可展开收缩的信息框tabSlideOut

网页特效

网站首页菜单导航日期时间背景图像图层样式鼠标键盘页面窗口色彩表格链接文字表单按钮计数转换游戏娱乐综合实例

您的位置: 网页特效 -> 页面窗口 -> 网页左侧可展开收缩的信息框tabSlideOut

网页左侧可展开收缩的信息框tabSlideOut

作者:admin 发布时间:2010-10-20 6:03:17 发布人: admin

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
 <title>网页左侧可展开收缩的信息框tabSlideOut </title>
 
    <style type="text/css" media="screen">
    body{padding:0;margin:0;  background:#39424b; font-family: verdana;}
 a {color:#176092; text-decoration:none;}
    a:hover {text-decoration:underline;}
    .slide-out-div {
       padding: 20px;
        width: 250px;
        background: #f2f2f2;
        border: #29216d 2px solid;
    }
    
 </style>

</script>
</head>

<body>
    <div class="slide-out-div">
        <a class="handle" href="http://web.archive.org/web/20150322030149/http://www.jz123.cn/plus/rssmap.html">Content</a>
        <h3>联系 & 订阅</h3>
        <p>联系站长家园：<a href="http://web.archive.org/web/20150322030149/mailto:jz123cn@126.com">jz123cn@126.com</a></p>
        <p>感谢您光顾站长家园，希望这里提供的一切资源信息，对您有用。</p>
        <p>订阅我：<a href="http://web.archive.org/web/20150322030149/http://www.jz123.cn/">www.jz123.cn</a></p>
    </div>

</body>
</html>

这个效果相信大家都比较熟悉了，因为类似的特效已经看到过不少，tabSlideOut只是其中的一款。它同样基于jquery来实现，不同之处或许只是它的美化吧，稍稍漂亮了那么一丁点儿，所以低一度第一眼就瞧上了，翻译了过来，与大家分享——

将本文收藏到QQ书签与更多好友分享

上一篇：文章：用户访问可以选择网页背景色下一篇：文章：Js标签页浏览控件推介：DOMTab

网页特效

网页左侧可展开收缩的信息框tabSlideOut

本类浏览排行 »

本站推荐文章 »