bootstrap/moban191/js/templatemo_custom.js
(function($) {
"use strict";
// Cache selectors
var lastId,
topMenu = $(".menu-holder"),
topMenuHeight = topMenu.outerHeight()+15,
// All list items
menuItems = topMenu.find("a"),
// Anchors corresponding to menu items
scrollItems = menuItems.map(function(){
var item = $($(this).attr("href"));
//alert(item.length);
if (item.length) { return item; }
});
// Bind click handler to menu items
// so we can get a fancy scroll animation
menuItems.click(function(e){
var href = $(this).attr("href"),
offsetTop = href === "#" ? 0 : $(href).offset().top-topMenuHeight+1;
$('html, body').stop().animate({
scrollTop: offsetTop
}, 300);
e.preventDefault();
});
// Bind to scroll
$(window).scroll(function(){
// Get container scroll position
var fromTop = $(this).scrollTop()+topMenuHeight;
// Get id of current scroll item
var cur = scrollItems.map(function(){
if ($(this).offset().top < fromTop)
return this;
});
// Get the id of the current element
cur = cur[cur.length-1];
var id = cur && cur.length ? cur[0].id : "";
if (lastId !== id) {
lastId = id;
// Set/remove active class
menuItems
.parent().removeClass("active")
.end().filter("[href=#"+id+"]").parent().addClass("active");
}
});
$(window).scroll(function(){
$('.site-header').toggleClass('scrolled', $(this).scrollTop() > 1);
});
//mobile menu and desktop menu
$("#responsive-menu").css({"right":-1500});
$("#mobile_menu").click(function(){
$("#responsive-menu").show();
$("#responsive-menu").animate({"right":0});
return false;
});
$(window).on("load resize", function(){
if($(window).width()>768){
$("#responsive-menu").css({"right":-1500});
}
});
$("#responsive-menu a").click(function(){
$("#responsive-menu").hide();
});
})(jQuery);
bootstrap/moban191/js/templatemo_custom.js的更多相关文章
- 参考bootstrap中的popover.js的css画消息弹框
前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...
- 使用bootstrap的dropdown部件时报错:error:Bootstrap dropdown require Popper.js
前言:前端小白一枚,刚注册博客,先发个学习过程中新碰到小问题试试水吧~ 摘要:最近在学习bootstrap,偶然碰到了一个小问题,bootstrap网站也没有做过多的解释,今天分享给大家. 问题描述: ...
- JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义
前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...
- bootstrap的css和js
css:<link href="http://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel=" ...
- socket.io+angular.js+express.js做个聊天应用(三)
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/www19940501a/article/details/27590611 接着前面博客文章socke ...
- Angular JS + Express JS入门搭建网站
3月份开始,接到了新的任务,跟UI开发有关,用的是Angular JS,Express JS等技术.于是周末顺便学习下新技术. 组里产品UI架构如下: 其中前端,主要使用Angular JS框架,另外 ...
- js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable
js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable 一.总结 一句话总结:bootstrap能够做为最火的框架,绝对不仅仅只有我看到的位置,它应该还有很多位置可 ...
- Angularjs在控制器(controller.js)的js代码中使用过滤器($filter)格式化日期/时间实例
Angularjs内置的过滤器(filter)为我们的数据信息格式化提供了比较强大的功能,比如:格式化时间,日期.格式化数字精度.语言本地化.格式化货币等等.但这些过滤器一般都是在VIEW中使用的,比 ...
- 什么是js和js的基本语法
时间:2016年12月15日 先讲讲基础语法: 大部分是来操作表单: js动态效果和数据交互(ajax?) js也有自己的API js大部分的DOM操作都是针对input的. 案例学习,对注册页面的简 ...
随机推荐
- Vue.2.0.5-生产环境部署
删除警告 为了减少文件大小,Vue 精简独立版本已经删除了所有警告,但是当你使用 Webpack 或 Browserify 等工具时,你需要一些额外的配置实现这点. Webpack 使用 Webpac ...
- file operation note
从HLE回来,大家拍了2499张照片,分放在N个文件夹下,下面的python将下层目录中文件移动到上层 import os,shutil dst=os.getcwd()+os.sep for path ...
- svn合并
1.先去 aone里我的变更 里 重建 新分支 相当于重主干上拉代码下来2.然后再去 原来的分支里 swich切换到新分支3.在原来的分支里 merge 到新分支的url4.选择最早的 version ...
- 20145207 《Java程序设计》第4周学习总结
前言 又到了大家最喜欢的前言时间,哈哈哈.我这个人啊,就是比较爱闲聊.正式在学校呆的第一天时间就在这里敲代码,自己都觉得自己伟大.不过好无聊呀....这周的内容说实话讲我还是挺感兴趣的,因为书上的例子 ...
- zoj The 12th Zhejiang Provincial Collegiate Programming Contest Lunch Time
http://acm.zju.edu.cn/onlinejudge/showContestProblem.do?problemId=5499 The 12th Zhejiang Provincial ...
- 如何在OneNote2013中粘贴高亮的代码
有的时候想在OneNote粘贴代码,但是直接复制粘贴进去的代码没有高亮,下面有一个办法让自己的代码在OneNote里面更加完整美观. 工具/原料 Notepad++ word2013 OneNote2 ...
- HDU 1052 Tian Ji -- The Horse Racing(贪心)(2004 Asia Regional Shanghai)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1052 Problem Description Here is a famous story in Ch ...
- 转:V$SQL,V$SQLAREA,V$SQLTEXT
V$SQL*表用于查看Shared SQL Area中SQL情况 V$SQLTEXT V$SQLTEXT用途很简单,就是用来查看完整的SQL语句,V$SQL和V$SQLAREA只能显示1000 byt ...
- 夺命雷公狗---DEDECMS----30dedecms数据dede_archives主表进行查询l操作
在plus目录下编写一个test2.php的文件,取出dede_archives的所有信息 <?php //编写test2.php这个文件,主要是为了实现可以取出dede_archives表的所 ...
- clock gate cell
clock gate的cell多采用latch的形式,来实现,尽可能避免glitch的产生. 可以的verilog建模方式: module cell_ckgate(TE,E,CP,Q) input ...