(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的更多相关文章

  1. 参考bootstrap中的popover.js的css画消息弹框

    前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...

  2. 使用bootstrap的dropdown部件时报错:error:Bootstrap dropdown require Popper.js

    前言:前端小白一枚,刚注册博客,先发个学习过程中新碰到小问题试试水吧~ 摘要:最近在学习bootstrap,偶然碰到了一个小问题,bootstrap网站也没有做过多的解释,今天分享给大家. 问题描述: ...

  3. JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义

    前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...

  4. bootstrap的css和js

    css:<link href="http://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel=" ...

  5. socket.io+angular.js+express.js做个聊天应用(三)

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/www19940501a/article/details/27590611 接着前面博客文章socke ...

  6. Angular JS + Express JS入门搭建网站

    3月份开始,接到了新的任务,跟UI开发有关,用的是Angular JS,Express JS等技术.于是周末顺便学习下新技术. 组里产品UI架构如下: 其中前端,主要使用Angular JS框架,另外 ...

  7. js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable

    js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable 一.总结 一句话总结:bootstrap能够做为最火的框架,绝对不仅仅只有我看到的位置,它应该还有很多位置可 ...

  8. Angularjs在控制器(controller.js)的js代码中使用过滤器($filter)格式化日期/时间实例

    Angularjs内置的过滤器(filter)为我们的数据信息格式化提供了比较强大的功能,比如:格式化时间,日期.格式化数字精度.语言本地化.格式化货币等等.但这些过滤器一般都是在VIEW中使用的,比 ...

  9. 什么是js和js的基本语法

    时间:2016年12月15日 先讲讲基础语法: 大部分是来操作表单: js动态效果和数据交互(ajax?) js也有自己的API js大部分的DOM操作都是针对input的. 案例学习,对注册页面的简 ...

随机推荐

  1. 解决: Fail to create empty document

    做 Programming Windows with MFC 2nd 的例子 MyWord 的时候. 发现启动的时候总是报错: Fail to create empty document. 搜索了一下 ...

  2. iOS - (调用系统本机发送短信功能)

    今天处理一个订单详情的界面,在订单详情页面上有联系方式(电话号码),在电话号码的右边有两图片,一个是电话样式的,一个是短信样式的,做为一名程序员(号称攻城师)一眼看下去就应该是一个 button,而不 ...

  3. SweetAlert2 使用教程

    SweetAlert2是一款功能强大的纯Js模态消息对话框插件.SweetAlert2用于替代浏览器默认的弹出对话框,它提供各种参数和方法,支持嵌入图片,背景,HTML标签等,并提供5种内置的情景类, ...

  4. CentOS安装Git

    准备安装Gityum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel perl-devel #下载git-1 ...

  5. C# 匿名方法

    每次写博客,第一句话都是这样的:程序员很苦逼,除了会写程序,还得会写博客!当然,希望将来的一天,某位老板看到此博客,给你的程序员职工加点薪资吧!因为程序员的世界除了苦逼就是沉默.我眼中的程序员大多都不 ...

  6. 创建纯洁的TableViewCell

    -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPat ...

  7. 2-sat(and,or,xor)poj3678

    Katu Puzzle Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 7949   Accepted: 2914 Descr ...

  8. ActionController::InvalidAuthenticityToken 解决办法(第二种尤其有效)

    第一种:  Ror代码 class FooController < ApplicationController       protect_from_forgery :except => ...

  9. Spring 中的 Bean 配置

    内容提要 •IOC & DI 概述 •配置 bean –配置形式:基于 XML 文件的方式:基于注解的方式 –Bean 的配置方式:通过全类名(反射).通过工厂方法(静态工厂方法 & ...

  10. php 迭代器

    迭代器(Iterator)模式,又叫做游标(Cursor)模式.GOF给出的定义为:提供一种方法访问一个容器(container)对象中各个元素,而又不需暴露该对象的内部细节. 百度百科: http: ...