防刷新jq左侧滚动条导航展示
html代码:
<div class="fangchan_navcont">
<div class="fangchan_nav">
<ul class="navul" style="width: 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
防刷新jq左侧滚动条导航展示的更多相关文章
- jQuery防京东浮动网站楼层导航代码
jQuery防京东浮动网站楼层导航代码 <!DOCTYPE html > <html xmlns="http://www.w3.org/1999/xhtml" ...
- React+Ant Design设置左侧菜单导航路由的显示与隐藏(与权限无关)
最近在学习react时,用到了很流行的UI框架Ant Design,也了解了一下Ant Design Pro,发现它们都有导航组件,Ant Design框架的导航菜单在这里,Ant Design Pr ...
- Flutter移动电商实战 --(23)分类页_左侧类别导航制作
自动生成dart类 https://javiercbk.github.io/json_to_dart/ 生成的代码 class Autogenerated { String code; String ...
- 隐藏左侧快速导航除DMS导航树之外的其他区域
<style type="text/css"> /*隐藏左侧快速导航除DMS导航树之外的其他区域*/ .ms-quicklaunchouter { display: n ...
- eclipse左侧的导航栏不见了怎么调
点击eclipse上方导航栏的window 然后再点击Reset Perspective 这样左侧的导航栏就出来了
- #AOS应用基础平台# 实现了在用户权限范围内自己定义的快捷菜单的导航展示
from=501" style="color:rgb(255,131,115); padding:0px; margin:0px; font-family:微软雅黑,Verdana ...
- spring boot 学习(九)小工具篇:?秒防刷新
注解 + 拦截器:?秒防刷新 小工具篇:工具许多都是我以前在 github 之类开源平台找到的小工具类,作者的信息什么的许多都忘了.先说声不好意思了.若有相关信息,麻烦提醒一下~ 解释 所谓的?秒防刷 ...
- jQuery---jq操作标签文本(html(),text()),jq操作文档标签(插入,删除,修改),克隆,,jq操作属性,jq操作class属性,jq操作表单value,jq操作css,jq操作盒子(重要),jq操作滚动条
jQuery---jq操作标签文本(html(),text()),jq操作文档标签(插入,删除,修改),克隆,,jq操作属性,jq操作class属性,jq操作表单value,jq操作css,jq操作盒 ...
- 18 ~ express ~ 前台分类导航展示 与 排序
一,前台分类导航展示 1,后台文件: /router/main.js router.get('/',(req,res,next)=>{ /** * 从数据库中读取分类信息 * rs是一个数组类 ...
随机推荐
- JS城市data
CityData = { "中国": { "北京": ["东城区", "西城区", "崇文区", & ...
- Reverse a singly linked list
Reverse a singly linked list. /** * Definition for singly-linked list. * struct ListNode { * int val ...
- First Day
以后这里将记录我的成长脚步啦~~ 欢迎吐槽 作为一个大三即将面临找工作的学渣,心中真的很焦急 要好好学前端!! Fighting~
- 转:C++ Boost/tr1 Regex(正则表达式)快速指南
C++ Boost/tr1 Regex(正则表达式)快速指南 正则表达式自Boost 1.18推出,目前已经成为C++11(tr1)的标准部分. 本文以Boost 1.39正则表达式为基础,应该广泛适 ...
- sql server查看正在执行的进程
SELECT SPID = er.session_id ,Status = ses.status ,[Login] = ses.login_name ,Host = ses.host_name ...
- Mybatis 批量insert
@Override public int insertHouseTypeScene(int htid, String name, String icon,int sort, List<House ...
- 如何根据不同的浏览器写不同的css样式达到兼容
做前端静态页面的时候总是发现,ie的兼容性很差,总会出点问题.然后就去改代码 ,改完以后 又发现 火狐 谷歌又挂了,这可咋整. 后来发现做个判断吧 哪里有问题哪里就做个判断呗 ,咋判断呢,这么 ...
- C#窗体自定义控件
using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing; u ...
- Android开发--RadioButton的应用
1.简介 RadioButton为单选按钮,当一个按钮被选中后,点击其他按钮无法使上一个按钮变为未选中状态.RadioGroup是可以容纳多个RadioButton的容器, 通过使用RadioGrou ...
- ASP.NET Redis 开发 [转]
Redis简介 Redis是一个开源的,使用C语言编写,面向“键/值”对类型数据的分布式NoSQL数据库系统,特点是高性能,持久存储,适应高并发的应用场景.Redis纯粹为应用而产生,它是一个高性能的 ...