jquery 分页
2015-08-20 15:10
796 查看
<script>
$(function(){
var AllHet = $(window).height();
var mainHet= $('.floatCtro').height();
var fixedTop = (AllHet - mainHet)/2
// $('div.floatCtro').css({top:fixedTop+'px'});
$('div.floatCtro p').click(function(){
var ind = $('div.floatCtro p').index(this)+1;
var topVal = $('#float0'+ind).offset().top;
$('body,html').animate({scrollTop:topVal},500)
})
$('div.floatCtro a').click(function(){
$('body,html').animate({scrollTop:0},500)
})
$(window).scroll(scrolls)
scrolls()
function scrolls(){
var f1,f2,f3,f4,f5,f6,f7,bck;
var fixRight = $('div.floatCtro p');
var blackTop = $('div.floatCtro a')
var sTop = $(window).scrollTop();
fl = $('#float01').offset().top;
f2 = $('#float02').offset().top;
f3 = $('#float03').offset().top;
f4 = $('#float04').offset().top;
f5 = $('#float05').offset().top;
f6 = $('#float06').offset().top;
if(sTop<=f2-100){
blackTop.fadeOut(300).css('display','none')
}
else{
blackTop.fadeIn(300).css('display','block')
}
if(sTop>=fl){
fixRight.eq(0).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f2-100){
fixRight.eq(1).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f3-100){
fixRight.eq(2).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f4-100){
fixRight.eq(3).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f5-100){
fixRight.eq(4).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f6-100){
fixRight.eq(5).addClass('cur').siblings().removeClass('cur');
}
}
})
</script>
<div class="floatCtro">
<p class="cur">热门名牌</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<a>
<font style="width:60px; height:1px; display:block"></font>
<span>返回顶部</span>
</a>
</div>
$(function(){
var AllHet = $(window).height();
var mainHet= $('.floatCtro').height();
var fixedTop = (AllHet - mainHet)/2
// $('div.floatCtro').css({top:fixedTop+'px'});
$('div.floatCtro p').click(function(){
var ind = $('div.floatCtro p').index(this)+1;
var topVal = $('#float0'+ind).offset().top;
$('body,html').animate({scrollTop:topVal},500)
})
$('div.floatCtro a').click(function(){
$('body,html').animate({scrollTop:0},500)
})
$(window).scroll(scrolls)
scrolls()
function scrolls(){
var f1,f2,f3,f4,f5,f6,f7,bck;
var fixRight = $('div.floatCtro p');
var blackTop = $('div.floatCtro a')
var sTop = $(window).scrollTop();
fl = $('#float01').offset().top;
f2 = $('#float02').offset().top;
f3 = $('#float03').offset().top;
f4 = $('#float04').offset().top;
f5 = $('#float05').offset().top;
f6 = $('#float06').offset().top;
if(sTop<=f2-100){
blackTop.fadeOut(300).css('display','none')
}
else{
blackTop.fadeIn(300).css('display','block')
}
if(sTop>=fl){
fixRight.eq(0).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f2-100){
fixRight.eq(1).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f3-100){
fixRight.eq(2).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f4-100){
fixRight.eq(3).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f5-100){
fixRight.eq(4).addClass('cur').siblings().removeClass('cur');
}
if(sTop>=f6-100){
fixRight.eq(5).addClass('cur').siblings().removeClass('cur');
}
}
})
</script>
<div class="floatCtro">
<p class="cur">热门名牌</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<a>
<font style="width:60px; height:1px; display:block"></font>
<span>返回顶部</span>
</a>
</div>
相关文章推荐
- jQuery+HTML5加入购物车代码分享
- jquery 计算两个日期之间的相差天数
- Jquery UI Custom的兼容问题
- jQuery库 之 jquery slimscroll插件使用
- jQuery地图map悬停显示省市代码分享
- Jquery单选框、复选框、下拉框动态设置默认项,及动态获取选中项。
- jQuery超赞的评分插件(8款)
- jQuery tmpl用法总结
- 使用Jquery解析Json基础知识
- jQuery网页版打砖块小游戏源码分享
- jQuery插件开发
- Jquery
- jQuery调用WebService实现增删改查的实现
- jQuery中.bind() .live() .delegate() .on()的区别
- jQuery里$(this)和this的区别在哪?
- jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
- jquery下载所有版本(实时更新)
- jquery插件之文字间歇自动向上滚动
- jquery插件之文字无缝向上滚动
- jquery click嵌套 事件重复注册 多次执行的问题解决