添加到百度首页
添加收藏 RSS 网站地图 旧版网站
  • 全部
  • 网页特效
  • 建站教程
  • 设计分享
当前位置:首页 > 网页特效 > CSS3+HTML5特效 >

jQuery+CSS3实现随滚动条滑动LOGO旋转特效

时间:2015-01-27      来源:互联网     
特效说明:
一款jQuery+CSS3实现随滚动条滑动LOGO旋转网页特效下载,预览此特效前请确保你所用的浏览器支持CSS3,请滚动浏览器滚动条查看效果!请用支持HTML5+CSS3主流浏览器预览效果。(兼容测试:FireFox、Chrome、Safari、Opera等支持HTML5/CSS3浏览器)
使用方法:
1、调用CSS样式:
<link rel="stylesheet" type="text/css" href="css/style.css" />

2、调用JS插件代码:
<script src="js/jquery.min.js"></script>

3、添加HTML代码:
<!--效果html开始-->......<!--效果html结束-->之间的html和js代码;放在<body></body>之间。

4、JS初始化代码:
<script>
$(function() {
 var rotate = function(logo, angle) {
  logo.css({
  "transform" : "rotate("+angle+"deg)"
  });
 }
 $(window).scroll(function(){
  rotate($(".zhuan"), $(window).scrollTop()*0.8);
 })

});
</script>
相关特效
  • CSS3 animate制作纸牌翻转效果

    CSS3 animate制作纸牌翻转效果

    一款CSS3 animate制作纸牌翻转效果网页特效,该特效通过点击图片实现2张图片动画旋转切换。……
    2016-06-12
  • 轻量级CSS3立体式3D旋转动画效果

    轻量级CSS3立体式3D旋转动画效果

    一款轻量级CSS3立体式3D旋转动画效果下载,非常简洁好看的纯CSS3旋转效果,当鼠标移动到图片上后,会立体式翻转显示隐藏的文字内容 鼠标移走后旋转返回初始状态。……
    2016-05-22
  • CSS3 radius实现圆形动画特效

    CSS3 radius实现圆形动画特效

    一款CSS3 radius实现圆形动画特效下载,该CSS3代码特效是一款简单的圆圈跟点旋转CSS3动画特效。CSS3属性radius学习教程。……
    2015-08-03
  • CSS3制作酷炫旋转动画网页特效

    CSS3制作酷炫旋转动画网页特效

    一款CSS3制作酷炫旋转动画网页特效,该CSS3旋转动画特效代码来自腾讯绿钻-QQ音乐,音乐你的生活!……
    2015-06-24
  • CSS3鼠标滑过渐变颜色旋转图标特效

    CSS3鼠标滑过渐变颜色旋转图标特效

    一款CSS3鼠标滑过渐变颜色旋转图标特效,超实用鼠标滑过旋转CSS3特效代码,简单易用,不会js照样可以做出绚丽的动画效果。……
    2014-12-16

最新更新特效

设计分享