jq一些常用的交互效果
jq回到顶部:
//回到顶部
$(window).scroll(function() {
//执行处理的代码
var a = document.body.scrollTop;
if($(document).scrollTop() > 0) {
$("#top").css("display", "block")
} else {
$("#top").css("display", "none")
}
})
$("#top").click(function() {
var speed = 200; //滑动的速度
$('body,html').animate({
scrollTop: 0
}, speed);
return false;
});
滚动加类:
$(document).scroll(function() {
if ($(document).scrollTop() >= 730) {
$('.shadow_box').addClass('fixed-top')
} else {
$('.shadow_box').removeClass('fixed-top')
}
})
jq一些常用的交互效果的更多相关文章
- 多功能前台交互效果插件superSlide
平时我们常用的"焦点图/幻灯片""Tab标签切换""图片滚动""无缝滚动"等效果要加载n个插件,又害怕代码冲突又怕不兼容 ...
- ScrollMagic – 酷毙了!超炫的页面滚动交互效果
ScrollMagic 是一款 jQuery 插件,它让你可以像使用进度条一样使用滚动条.如果你想在特定的滚动位置开始一个动画,并且让动画同步滚动条的动作,或者把元素粘在一个特定的滚动位置,那么这款插 ...
- AxureRP7.0各类交互效果汇总帖(转)
了便于大家参考,我把这段时间发布分享的所有关于AxureRP7.0的原型做了整理. 以下资源均有对应的RP源文件可以下载. 当然 ,其中有部分是需要通过完成解密游戏[攻略]才能得到下载地址或者下载密码 ...
- 类似UC天气下拉和微信下拉眼睛头部弹入淡出UI交互效果(开源项目)。
Android-PullLayout是github上的一个第三方开源项目,该项目主页是:https://github.com/BlueMor/Android-PullLayout 原作者项目意图实现 ...
- 微信网页悬浮窗交互效果的web实现
一.微信的悬浮窗交互效果 微信更新后,发现多了个悬浮窗功能.公众号阅读,网页浏览回退后默认会出现.再点击,可以回到刚才阅读的地方.于是,再也不会遇到回复老婆的信息,再切换回来重新找刚才阅读东西的麻烦了 ...
- 【新手指南】App原型设计:如何快速实现这6种交互效果?
做App原型设计,那么页面切换.进度条.页面滚动.图片轮播,下拉菜单,搜索框这些交互效果必不可少.如何简单快速地实现这些效果呢?以下小编根据经验为大家提供了一些简单的设计方法,以供参考. 1.页面跳转 ...
- 用wamp实现前端和php的交互效果
我们今天来用php来做一下前台与后台的交互效果,首先我们先打开这个软件. 看一下电脑右下角的小图标 当变成之后鼠标左键 打开这个之后点击第二个之后会打开一个网站 点击右面页面的数据库打开新建数据库,填 ...
- Axure教程:滑动进度条、圆形进度环的复杂交互效果实现方法
滑动条.进度条.进度环,是产品原型中比较常见的进度展示功能.今天笔者分享的是使用Axure原型工具实现两种进度展示功能中相对复杂的交互效果. 效果一.可拖动.可显示进度值.可计算多个页面均值的滑动进度 ...
- Flutter实战视频-移动电商-32.列表页_小类高亮交互效果制作
32.列表页_小类高亮交互效果制作 点击大类右侧的横向的小类红色显示当前的小类别 解决之前溢出的问题: 先解决一个bug,之前右侧的这里设置的高度是1000,但是有不同的虚拟机和手机设别的问题造成了溢 ...
随机推荐
- 2016/2/24 1,css有几种引入方式 2,div除了可以声明id来控制,还可以声明什么控制? 3,如何让2个div,并排显示。4,清除浮动 clear:left / right / both
1,css有几种引入方式 使用HTML标签的STYLE属性 将STYLE属性直接加在单个的HTML元素标签上,控制HTML标签的表现样式.这种引入CSS的方式是分散灵活方便,但缺乏整体性和规划性,不利 ...
- iOS 7 present/dismiss转场动画
前言 iOS 7以后提供了自定义转场动画的功能,我们可以通过遵守协议完成自定义转场动画.本篇文章讲解如何实现自定义present.dismiss自定义动画. 效果图 本篇文章实现的动画切换效果图如下: ...
- javascript base64 编码,兼容ie6789
用Javascript进行base64编码,在高版本的IE浏览器(IE9以上版本),和firefox,chrome浏览器里是非常方便的.这些浏览器的window对象中内置了base64的编码和解码方法 ...
- Java Socket实战之一:单线程通信
转自:http://developer.51cto.com/art/201202/317543.htm 现在做Java直接使用Socket的情况是越来越少,因为有很多的选择可选,比如说可以用sprin ...
- python 面向对象八 多继承
python是支持多继承的,在设计类的继承关系时,通常,主线都是单一继承下来的.但是,如果需要“混入”额外的功能,通过多重继承就可以实现,这种设计通常称之为MixIn. 为了更好地看出继承关系,以Mi ...
- Codeforces 908F - New Year and Rainbow Roads 【脑洞】
题意:在一条数轴上有若干'R','B','G'点,连接两个点的代价是位置差,要求使用最小代价使得除去所有'R'点后剩下的所有点联通,除去所有'B'点后剩下的所有点联通. 还以为会是什么最小生成树,结果 ...
- python安装教学
1.首先登陆到python的官方网站 1https://www.python.org/ 2.鼠标放在Download上,点击下面对应的型号,我的是Windows 3.点击Windows到此页面,点击3 ...
- concurrent包下的Exchanger练习
Exchanger可以在两个线程之间交换数据,只能是2个线程,他不支持更多的线程之间互换数据. 当线程A调用Exchange对象的exchange()方法后,他会陷入阻塞状态,直到线程B也调用了exc ...
- 使用VS2008,VS2010编译64位的应用程序
要编译生成64位的应用程序,就必须把vs2008,或vs2010的配置管理器设置为x64. 如果你的配置管理器那里没有x64这个选项,那么是你在安装vs时可能没有安装这个组件.你不用卸载vs,只需打开 ...
- Java中关键字continue、break和return的区别
Java中关键字continue.break和return的区别: continue:跳出本次循环继续下一次循环 break: 跳出循环体,继续执行循环外的函数体 return: 跳出整个函数 ...