经常用到的js插件(pc端、移动端)
1.TouchSlider
幻灯片、走马灯等一直是网页中比较常用的交互效果,在移动平台上也不例外,唯一的区别是操作方式不同,这里介绍一款同时适用于触摸、鼠标操作的幻灯片交互脚本 —— Touchslider
优点:
- 兼容性好,适用于主流的桌面及移动(基于Weibkit)浏览器,且同时兼容鼠标和触摸操作
- 性能优秀,在 Android 和 iOS 等移动平台上的交互表现非常流畅
- 可塑性高,通过插件本身的设置再配合 CSS 可以打造成幻灯片、走马灯等多种交互效果
2.jquery.rotate.js
引入下方的jquery.rotate.js文件,然后通过$("选择器").rotate(角度);可以旋转任意角度,
例如$("#rotate-image").rotate(45);把这句放在$(document).ready(function(){ });中
就是将id为rotate-image的图片旋转45度。
不过,貌似在Chrome中总是不显示。
唉,找了两个小时,才发现Chrome太坑爹了,没法获取图片的长宽。
解决办法是,把$("#rotate-image").rotate(45);放在
$(window).load(function(){ });中,因为在Chrome中图片在执行$(document).ready(function(){ });中的语句时并没有加载完图片,坑爹啊。
另外可以更方便的通过调用$("选择器").rotateRight()和$("选择器").rotateLeft()来分别向右旋转90度和向左旋转90度。
jquery.rotate.js: