zoukankan      html  css  js  c++  java
  • 防刷新jq左侧滚动条导航展示

    html代码:

    <div class="fangchan_navcont">
            <div class="fangchan_nav">
                <ul class="navul" style=" 600px;">
                <li><a href="/fenlei/fangchan.html">全部</a></li>
                    <li><a href="/fenlei/fwcz.html">房屋出租</a></li>

          <li class="liactive"><a href="/fenlei/esf.html">二手房</a></li>

          <li><a href="/fenlei/fwqg.html">房屋求购</a></li>

          <li><a href="/fenlei/fwqz.html">房屋求租</a></li>

          <li><a href="/fenlei/spzr.html">商铺转让</a></li>                
                    <div class="clear"></div>
                </ul>
            </div>
        </div>

    <script>
            var navulsize = $('.navul li').size();
                var navulwidth = $('.navul li').width();
                var allwidth = navulwidth*navulsize;
                $('.navul').width(allwidth);
                $('.navul li').click(function(){
                    var index = $(this).index();
                    var indexur = '#' + index;
                    var indexurl = $(this).children('a').attr('href');
                    var hehref = indexurl + indexur;
                    var data = $(this).attr('data');
                    $(this).children('a').attr('href',hehref);
                    $(data).show().siblings('.gengxinbox').hide();
                    $(this).addClass('liactive').siblings('li').removeClass('liactive');
                });
                $(function(){
                    var endhref = location.href;
                    var parsenum = parseInt(endhref.replace(/[^0-9]/ig,""));
                    var positionleft = $('.navul li:eq('+parsenum+')').offset().left;
                    $('html,.fangchan_nav').animate({scrollLeft:positionleft+'px'}, 0);
                });
            </script>

    实例地址:http://m.qingzhou.cc/fenlei/fangchan.html#0

  • 相关阅读:
    MDK(keil)4.7中文注释乱码解决
    小型功率放大器的设计与制作
    增强输出的电路
    晶体管电路设计学习笔记(一)
    MOSFET学习
    sysTick系统定时器
    C#面向对象 什么是面向对象
    JS基础 超链接、数列的用法,行内元素和块级元素
    JS基础 常用函数、事件、阻止事件冒泡
    JS基础 定时器【setTimeout、setInterval、clearInterval 】
  • 原文地址:https://www.cnblogs.com/mm2015/p/5610780.html
Copyright © 2011-2022 走看看