JS创建优美的页面滑动块效果 - Glider.js

曾经看到http://www.panic.com/coda/ 上的滑动块，非常喜欢。可惜自己多JS了解不深，没法模拟出来。

早上发现Google code上的一个JsFrame - Glider.js。很容易的实现http://www.panic.com/coda/ 上的滑动块效果。
Google code上的项目地址：http://code.google.com/p/missingmethod-projects/

600)?'600px':'auto'; }" alt=uploads/200709/26_102259_1.jpg src="http://zsrimg.ikafan.com/upload/20070927195357462.jpg">

打包下载

赞 (0)

相关推荐

  • JS创建优美的页面滑动块效果 - Glider.js

    曾经看到http://www.panic.com/coda/ 上的滑动块,非常喜欢.可惜自己多JS了解不深,没法模拟出来. 早上发现Google code上的一个JsFrame - Glider.js.很容易的实现http://www.panic.com/coda/ 上的滑动块效果. Google code上的项目地址:http://code.google.com/p/missingmethod-projects/ 600)?'600px':'auto'; }" alt=uploads/2007

  • 小程序实现滑动块效果

    本文实例为大家分享了小程序实现滑动块效果的具体代码,供大家参考,具体内容如下 当你在复制的时候 一定要 把js 逻辑的 list 数据更改就行了 小程序的css样式 .box { width: 100vw; background: #F2F2F2; transition: all 3s; } .box-b { height: 8vh; width: 100%; display: flex; justify-content: space-between; background-color: #FA

  • js实现简洁的TAB滑动门效果代码

    js实现简洁的TAB滑动门效果代码

    本文实例讲述了js实现简洁的TAB滑动门效果代码.分享给大家供大家参考.具体如下: 这是一款滑动门代码,简洁TAB,简单的鼠标导航效果,大家或许经常见到的效果啦,鼠标放在主菜单上,下边框架内的内容会跟着变换,鼠标不需要点击,只需要滑上去就可切换内容,像一扇门,所以有时候别人叫"滑动门"菜单. 运行效果如下图所示: 在线演示地址如下: http://demo.jb51.net/js/2015/js-tab-simple-cha-style-codes/ 具体代码如下: <html&

  • Android如何使用ViewPager2实现页面滑动切换效果

    目录 1.引言 2.实现页面滑动切换 2.1 引入ViewPager2库 2.2 使用ViewPager2 2.3 构建Fragment 2.4 继承FragmentStateAdapter 2.5 将ViewPager2与适配器绑定 2.6 垂直方向滑动切换 2.7 Fragment更新 3.总结 1.引言 在很多应用中,我们经常会看到多个页面之间滑动切换的场景,ViewPager2是ViewPager的升级版,本文将简要介绍如何使用ViewPager2.FragmentStateAdapte

  • js实现左侧网页tab滑动门效果代码

    js实现左侧网页tab滑动门效果代码

    本文实例讲述了js实现左侧网页tab滑动门效果代码.分享给大家供大家参考.具体如下: 这是一款开口靠左的网页滑动门,网页滑动门,TAB滑动门,竖排滑动门菜单,竖排TAB选项卡,兼容IE6/IE7/FF/opera浏览器.其实竖排和横排的代码基本一样,只不过稍加修改就可以了.只要学会了一种滑动门,就能举一返三了. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-left-tab-cha-style-codes/ 具体代码如下: <!DOCTY

  • JS+CSS实现简易的滑动门效果代码

    JS+CSS实现简易的滑动门效果代码

    本文实例讲述了JS+CSS实现简易的滑动门效果代码.分享给大家供大家参考.具体如下: 看了很多的滑动门和滑动菜单的资料,总算写出来了一个像样的滑动门,虽然外观不怎么样,但可以兼容火狐,还请老前辈们不要笑话,以后有好多西再请大家批评. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-css-simple-hdtx-demo-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1

  • JS实现的左侧竖向滑动菜单效果代码

    JS实现的左侧竖向滑动菜单效果代码

    本文实例讲述了JS实现的左侧竖向滑动菜单效果代码.分享给大家供大家参考,具体如下: 这是一款经过改造的左侧竖向滑动菜单,基于JavaScript+CSS,没有过多的修饰,主要想实现菜单的动画效果,想用的朋友,自己美化吧. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-left-scroll-style-menu-demo/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr

  • Android应用中利用ViewPager实现多页面滑动切换效果示例

    Android应用中利用ViewPager实现多页面滑动切换效果示例

    1.添加android support包 因为上面的几个类都是在android support包中才提供,我们先添加包. 在Eclipse->Window->Android SDK Manager,选择列表中Extras->Android Support Library进行安装.下载完后在android-sdk\extras\android\support目录下,这里我们选择v4版本,进入v4目录,拷贝其中的android-support-v4.jar文件到工程的libs目录(若没有新建

  • js网页侧边随页面滚动广告效果实现

    a.scrollTop的计算: b.滚动元素的定位值计算: c.滚动周期设定: 代码如下: css部分: 复制代码 代码如下: /*测试用的高度*/ body{ height:3000px;} div,ul,li,body{margin:0; padding:0;} /*position:absolute;用于元素的定位*/ #roll{width:50px; height:100px; background:#99CC00; position:absolute;} Html代码: 复制代码 代

  • Android实现页面滑动切换动画

    本文实例为大家分享了Android实现页面滑动切换动画的具体代码,供大家参考,具体内容如下 实现两个页面滑动切换,一些相册的效果也是如此 一个Activity的界面配置文件 activity_main.xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

随机推荐