Jquery仿百姓网的意见反馈和返回顶部特效

dengjianbin 13年前
Jquery仿百姓网的意见反馈和返回顶部特效是一款很实用、常用的功能,用了它之后会增强用户体验效果,直接在当前页留言,跟随滚动滑动,自动显示和隐藏返回顶部功能。
 
效果如下
状态1
Jquery插件,Jquery资源,Jquery特效,div+css 
状态2
Jquery插件,Jquery资源,Jquery特效,div+css 
 
状态3
Jquery插件,Jquery资源,Jquery特效,div+css

主要代码如下:
<script type="text/javascript">  $(function(){   $body = (window.opera) ? (document.compatMode == "CSS1Compat" ? $('html') : $('body')) : $('html,body');   $animating = false;   $('.fixedBtn .top').click(function(){    if ($animating == false) {     $body.animate({scrollTop: 0}, 500);     $animating = true;    }    return false;   });   $(window).scroll(function(){    if ($('.fixedBtn').offset().top > 500) {     $('.fixedBtn .top').css('display', 'inline-block');    } else {     $('.fixedBtn .top').css('display', 'none');     $animating = false;    }   });    var fixedBtn = $('.fixedBtn'),    feedback = $('.feedback', fixedBtn),    feedbackCnt = $('.feedbackCnt'),    sendBtn = $('.button', fixedBtn),    content = $('textarea', fixedBtn),    feedbackTips = $('.feedbackTips', fixedBtn),    FBCLASS = 'fb-open',    close = function(){     fixedBtn.animate({      right: '-=350'     })     feedbackCnt.removeClass(FBCLASS);    },    open = function(){     feedbackTips.hide();     feedbackCnt.show();     fixedBtn.animate({      right: '+=350'     });     feedbackCnt.addClass(FBCLASS);    };   feedback.length && feedback.on('click', function(e){    e.preventDefault();    feedbackCnt.hasClass(FBCLASS) ? close() : open();   });   });  </script>

在线演示和下载