118 строки
3.8 KiB
JavaScript
118 строки
3.8 KiB
JavaScript
$(function(){
|
||
//默认遮罩层 隐藏
|
||
$(".mui-backdrop").addClass('none');
|
||
// 默认选中第一个行业 全部
|
||
$(".my-style").children().first().addClass('actives')
|
||
$(".select").children().first().addClass('actives')
|
||
|
||
// tab栏切换
|
||
$(".header-cater-left").on('click',function(){
|
||
$(".header-cater-rigth").css("border-bottom", "none;")
|
||
$(this).css("border-bottom", "2px solid #54708c;")
|
||
$(".dom-arrow").css("display","block")
|
||
})
|
||
|
||
$(".header-cater-rigth").on('click',function(){
|
||
$(".header-cater-left").css("border-bottom", "none;")
|
||
$(this).css("border-bottom", "2px solid #54708c;")
|
||
$(".dom-arrow").css("display","none")
|
||
})
|
||
// 更多模板显示和隐藏
|
||
$(".dom-arrow").on('click',function(){
|
||
$(".mui-backdrop").toggleClass('none');//toggleClass() 对设置或移除被选元素的一个或多个类进行切换。
|
||
})
|
||
// 更多模板选中添加样式
|
||
$(".select").on("click",".text-value",function(){
|
||
$(this).addClass('active').siblings().removeClass('active')
|
||
$(".mui-backdrop").addClass('none');
|
||
})
|
||
//点击分类显示
|
||
$(".classify").on('tap',function(){
|
||
$(".cates-box").css("display","block")
|
||
})
|
||
|
||
// 选择行业
|
||
$(".my-style").on("click",".catres-value",function(){
|
||
$(this).addClass('actives').siblings().removeClass('actives')
|
||
})
|
||
$(".select").on("click",".text-value",function(){
|
||
$(this).addClass('actives').siblings().removeClass('actives')
|
||
})
|
||
// 确定之后隐藏
|
||
$(".my-style-btn").on("click",function(){
|
||
// 获取右侧遮盖层选中行业数据
|
||
var elem = $(".catres-value.actives");
|
||
var elemId = elem[0].id;
|
||
|
||
// 判断页面元素id是否为[全部]的id，否则根据行业id查询作品列表
|
||
if(elemId != "clazz_ind_all"){
|
||
var idStrs = elemId.split("clazz_ind_");
|
||
// 根据行业id查询作品
|
||
doWorksSearchByIndustryId(idStrs[1]);
|
||
} else {
|
||
// 查询全部
|
||
doWorksSearchByIndustryId();
|
||
}
|
||
|
||
$(".cates-box").css("display","none")
|
||
})
|
||
$(".box-showdom").on("tap",function(){
|
||
$(".cates-box").css("display","none")
|
||
})
|
||
|
||
// 模板库首页-行业选中-确定之后隐藏
|
||
$(".my-style-btn-template-home").on("click",function(){
|
||
// 获取右侧遮盖层选中行业数据
|
||
var elem = $(".catres-value.actives");
|
||
var elemId = elem[0].id;
|
||
|
||
// 判断页面元素id是否为[全部]的id，否则根据行业id查询作品列表
|
||
if(elemId != "clazz_ind_all"){
|
||
var idStrs = elemId.split("clazz_ind_");
|
||
// 根据行业id查询作品
|
||
doTemplateSearchByIndustryId(idStrs[1]);
|
||
} else {
|
||
// 查询全部
|
||
doTemplateSearchByIndustryId();
|
||
}
|
||
|
||
$(".cates-box").css("display","none")
|
||
})
|
||
$(".box-showdom").on("tap",function(){
|
||
$(".cates-box").css("display","none")
|
||
})
|
||
|
||
//显示出返回顶部
|
||
$(window).scrollTop();
|
||
// 被卷去的头部 scrollTop() / 被卷去的左侧 scrollLeft()
|
||
// 页面滚动事件
|
||
// .son-box 改为 .commodity-box
|
||
var boxTop = $(".commodity-box").offset().top;
|
||
$(window).scroll(function() {
|
||
// console.log(11);
|
||
// console.log($(window).scrollTop());
|
||
if ($(window).scrollTop() >= boxTop) {
|
||
$(".top").show();
|
||
} else {
|
||
$(".top").hide();
|
||
}
|
||
});
|
||
// 返回顶部
|
||
$(".top").click(function() {
|
||
clickHandler()
|
||
})
|
||
// 动画返回
|
||
function clickHandler() {
|
||
var currentScroll = document.documentElement.scrollTop || document.body.scrollTop;
|
||
if (currentScroll > 0) {
|
||
window.requestAnimationFrame(clickHandler);//专门用于请求动画的API requestAnimationFrame，顾名思义就是请求动画帧。
|
||
window.scrollTo(0, currentScroll - (currentScroll / 6));
|
||
}
|
||
}
|
||
|
||
//搜索之后显示的
|
||
$(".my-classify").on('tap',function(){
|
||
$(".serch-show").show()
|
||
$(".header-cater").hide()
|
||
})
|
||
}) |