郁闷吧 微信小程序 4188479 63242849 39070147 130690866
还没有任何记录...

双色球太湖字谜预测专注于网页素材下载  ,提供网站模板  、网页设计、ps素材、图片素材等,服务于【个人站长】【网页设计师】和【web开发从业者  】的代码素材与设计素材网站。

双色球太湖字谜预测提供网页素材下载 、网站模板
这一切都是免费的!
当前位置:双色球太湖字谜预测 > javascript > 双色球太湖字谜预测 >

jquery双色球太湖字谜预测双色球太湖字谜预测

来源:jquery特效 作者: 双色球太湖字谜预测 日期:2012-06-17 人气:
这个jquery双色球太湖字谜预测双色球太湖字谜预测jquery特效弹出下拉菜单效果 ,考虑到不需要改动程序所以就利用原来的 JS代码,用ajax的方式加载(以后只维护那个 ajax加载的文件即可 

双色球太湖字谜预测说明:id="lr_systembox" 这个外层的父层是演示用的层  ,实际应用中你可以借用顶部或者是其他什么地方的 div层,这个父层要设置相对定位,为了绝对定位里面的弹出菜单的位置 。

这个双色球太湖字谜预测双色球太湖字谜预测 jquery特效弹出下拉菜单效果 ,是双色球太湖字谜预测在一做学校网站的时候用的,需求要在中心校的下属学校的顶部都出现这个菜单,所以双色球太湖字谜预测就采用的灰色按钮(灰色可以搭配各种风格颜色 ^_^),考虑到不需要改动程序所以就利用原来的 JS代码,用ajax的方式加载(以后只维护那个 ajax加载的文件即可 )。

也许你会觉得双色球太湖字谜预测的弹出菜单结构有点复杂了,其实不然,dl dt dd结构是有后续考虑的比如要加三级菜单的时候,这种结构就会有一点用武之地了,懒人可以再添加dd标签

双色球太湖字谜预测的拙作希望能帮助到像我一样的菜鸟,高手可以飘过自己写的 。^_^

核心jquery特效代码如下:
<script type="text/javascript">
$(document).ready(function(){
    var lr_systembtn = $("#lr_systembtn");
    var lr_menu = $("#lr_menu");
    lr_systembtn.mouseenter(function(){
        t_delay= setTimeout(function(){
            lr_menu.fadeIn("slow");
        }200);
    });
    lr_systembtn.mouseleave(function(){
        clearTimeout(t_delay);
        lr_menu.fadeOut("slow");
    });

});
</script>

css代码:
/*双色球太湖字谜预测弹出菜单 */
#lr_systembox{ width:980px; height:50px; background-color:#CCC; position:relative; margin:0 auto; z-index:100000;}
.lr_systembtn{ width:201px; height:35px; line-height:33px;position:absolute; top:0px; right:0px; z-index:100004;}
.lr_systembtn .lr_abtn{ width:100%; height:35px; display:block; font-size:15px; font-weight:bold;color:#666666;
background-image: url(lr_images/btn_system.png);background-repeat:no-repeat;background-position:left top;}
.lr_systembtn .lr_abtn:hover{color:#333333;background-position:left bottom;}
.lr_systembtn .lr_abtn span{ padding-left:28px;}
.lr_menu{ width:184px; padding:8px 6px 8px 6px; background-color:#ffffff; border:#ACACAC solid 2px;filter:alpha(opacity=90);opacity: 0.90;
position:absolute; top:35px; right:0px;  z-index:100005;display:none;}
.lr_menu dl{width:100%; display:block; overflow:hidden;}
.lr_menu a{ width:100%;display:block; color:#666666;border-bottom:#ACACAC dashed 1px;height:30px; line-height:30px; font-size:14px;
background-image: url(lr_images/jt1.gif);background-repeat:no-repeat;background-position:6px center;}
.lr_menu a:hover{background-color:#E2E2E2; color:#333333; text-decoration:none;}
.lr_menu dt{}
.lr_menu dt a{font-weight:bold;text-indent:14px;}
.lr_menu dd a{text-indent:24px;background-position:16px center;}

html代码:
<div id="lr_systembox">

    <div id="lr_systembtn" class="lr_systembtn">
        <a href="#" class="lr_abtn"><span>双色球太湖字谜预测为您提供</span></a>
        <div id="lr_menu" class="lr_menu">
          <dl>
             <dt><a href="http://www.vehicleheating.com/js/" target="_blank">jquery特效</a></dt>
          </dl>
          <dl>
             <dt><a href="http://www.vehicleheating.com/js/nav/" target="_blank">双色球太湖字谜预测</a></dt>
             <dd><a href="#" target="_blank">三级菜单测试 </a></dd>
             <dd><a href="#" target="_blank">三级菜单测试 </a></dd>
          </dl>   
          <dl>
             <dt><a href="http://www.vehicleheating.com/js/slide/" target="_blank">焦点幻灯片</a></dt>
          </dl>
          <dl>
             <dt><a href="http://www.vehicleheating.com/js/texiao/" target="_blank">网页特效</a></dt>
          </dl>
          <dl>
             <dt><a href="http://www.vehicleheating.com/qqkefu/" target="_blank">qq在线客服代码 </a></dt>
          </dl>   
          <dl>
             <dt><a href="http://www.vehicleheating.com/jquery_tanchu/" target="_blank">jquery弹出层</a></dt>
          </dl>       
        </div>
    </div>

</div>

本文链接:jquery双色球太湖字谜预测双色球太湖字谜预测http://www.vehicleheating.com/js/nav/jqcaidan/

(责任编辑:双色球太湖字谜预测)

jquery双色球太湖字谜预测双色球太湖字谜预测由双色球太湖字谜预测收集整理,您可以自由传播 ,请主动带上本文链接

web前端开发就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾 ,希望有一天能帮到您。