关键词检索
Banner

描述：基本banner轮播基于 swiper
检索关键词：banner 轮播图 单图轮播 视频轮播

手机导航

描述：常用手机导航基于 mmenu，独立于PC导航结构，操作简单。
检索关键词：导航 手机导航 mmenu.js mmenu改-具体改了哪里我忘记了

页面滚动数字增长

描述：常用页面滚动数字递增 running。
检索关键词：递增 数字递增 滚动递增 页面滚动递增

图片加载成功后执行

描述：部分结构需要图片支撑，亦或是交互效果在加载完之后执行 imagesloaded。
检索关键词：图片加载 加载成功后执行 资源加载

多图轮播

描述：多图轮播 基于swiper。相关响应式参数设置参考API breakpoints
检索关键词：多图轮播 swiper响应式

同一套代码不同分辨率展示
swiper扩展

描述：基于swiper。相关参数设置参考API
检索关键词：swiper扩展 swiper 形变

这里收录除一般swiper效果外的其他基于7.x的魔改效果最新版。 选项卡+swiper
提供一种思路 
						

$(".honor-menu a").click(function () {
	$(this).addClass("act").siblings("a").removeClass("act");
	$(".honor-slider .slider-con").eq($(this).index()).addClass("act").siblings(".slider-con").removeClass("act");
	$(".slider-con .swiper-container").each(function (index) {
		$.swiperOption($(this), $(this).parent(".slider-con").find(".swiper-pagination"), 4, 40, $(this).parent(".slider-con").find(".swiper-button-next"), $(this).parent(".slider-con").find(".swiper-button-prev"));
	});
})

$.extend({
	"swiperOption": function (f1, f2, f3, f4, f5, f6) {
		new Swiper(f1, {
			slidesPerView: f3,
			spaceBetween: f4,
			allowTouchMove: false,
			navigation: {
				nextEl: f5,
				prevEl: f6,
			},
			pagination: {
				el: f2,
				clickable: true,
			},
			breakpoints: {
				1100: {
					slidesPerView: 2,
					spaceBetween: 10
				}
			}
		});
	},
});

$(".slider-con .swiper-container").each(function (index) {
	$.swiperOption($(this), $(this).parent(".slider-con").find(".swiper-pagination"), 4, 40, $(this).parent(".slider-con").find(".swiper-button-next"), $(this).parent(".slider-con").find(".swiper-button-prev"));
});
视频弹窗

描述：基于 layer。很遗憾layer没能继续保持更新，因此，基本库将作为layer弹窗基础版本，之后将会以此迭代。
检索关键词：视频弹窗 弹窗

点击播放视频
模拟锚点

描述：锚点链接，让锚点链接更丝滑
检索关键词：锚点 模拟锚点 

						
$('.box a').click(function(){
	if (window.location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && window.location.hostname == this.hostname) {
		var $target = $(this.hash);
		$target = $target.length && $target || $('[name=' + this.hash.slice(1) + ']');
		if ($target.length) {
			var targetOffset = $target.offset().top;
			$('html,body').animate({
				scrollTop: targetOffset - 150
			}, 1000);
			return false;
		}
	}
});
模拟滚动条

描述：基于mCustomScrollbar。
检索关键词：模拟滚动条 scrollbar 

						
$(".box").mCustomScrollbar({
	scrollButtons: {
		enable: true
	},
	theme: "dark-thin"
});
导航菜单下拉

描述：无序列关联，仅靠伪类
检索关键词：导航 菜单 下拉 导航菜单下拉

  • 下拉触发区域 
    • 						
jQuery(document).ready(function(){
	var qcloud={};
	$('[_t_nav]').hover(function(){
		var _nav = $(this).attr('_t_nav');
		clearTimeout( qcloud[ _nav + '_timer' ] );
		qcloud[ _nav + '_timer' ] = setTimeout(function(){
		$('[_t_nav]').each(function(){
		$(this)[ _nav == $(this).attr('_t_nav') ? 'addClass':'removeClass' ]('nav-up-selected');
		});
		$('#'+_nav).stop(true,true).slideDown(200);
		}, 150);
	},function(){
		var _nav = $(this).attr('_t_nav');
		clearTimeout( qcloud[ _nav + '_timer' ] );
		qcloud[ _nav + '_timer' ] = setTimeout(function(){
		$('[_t_nav]').removeClass('nav-up-selected');
		$('#'+_nav).stop(true,true).slideUp(200);
		}, 150);
	});
});
    滚动条动画

    描述：wow.js
    检索关键词：滚动动画 页面动画 

    						
//普通初始化
wowInt();
//序列初始化
wowDelay(".box .item", $('.item').length, "0.2");
//序列
function wowDelay(box, row, delayTime) {
	$(box).children().each(function(index) {
		for (var i = 0; i < row; i++) {
			if (index % row == i) {
				$(this).attr("data-wow-delay", i * delayTime + 's');
			};
		};
	});
};
function wowInt() {
	if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))) {
		var wow = new WOW({
			boxClass: 'wow',
			animateClass: 'animated',
			offset: 100,
			mobile: false,
			live: true
		});
		wow.init();
	};
}