0
我想实现一个类似于亚马逊或沃尔玛的固定标题。 我使用下面的代码固定标题滑动效果不起作用
<script>
$(window).scroll(function(){
var sticky = $('#pts-mainnav')
var sticky2 = $('#pts-verticalmenu'),
scroll = $(window).scrollTop();
if (scroll >= 220){
sticky.slideDown('2000', "swing");
sticky.addClass('fixed');
sticky2.addClass('dropdown-fixed');
$('#b').show();
$('#fixed-usermenu').show();
$('#fixed-verticalmenuid').show();
$("#categoriesname").html(" ");
}else{
sticky.removeClass('fixed');
sticky2.removeClass('dropdown-fixed');
$('#b').hide();
$('#fixed-usermenu').hide();
$('#fixed-verticalmenuid').hide();
$("#categoriesname").html("Όλα τα προϊόντα");
sticky.removeAttr("style");
sticky.removeAttr("class");
}
});
</script>
,然后将下面的.css
@media all and (min-width: 780px){
.fixed {
position:fixed;
top:0;
z-index:9999;
width:100%;
max-width:1250px;
-webkit-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
-webkit-box-shadow: 0 0 3px #333333;
box-shadow: 0 0 3px #333333;
}
.dropdown-fixed {width:68px;}
}
而且althoug固定头的工作,我不能ajust下拉作用的行为类似于亚马逊或沃尔玛。
代码是否正确? 我会真的很高兴,如果有人能帮助我
您可以在以下网址here