jquery做的滑动按钮开关

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jquery做的滑动按钮开关</title> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/><…

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-…

用jQuery做一个三级菜单，鼠标移动到二级菜单的选项上，然后再迅速离开后，当鼠标再移动到该一级菜单或其他二级菜单选项，三级菜单也会显示。

用jQuery做一个三级菜单,鼠标移动到二级菜单的选项上,然后再迅速离开后,当鼠标再移动到该一级菜单或其他二级菜单选项,三级菜单也会显示. 原因:在为一个元素绑定hover事件之后,用户把光标移入元素时会触发动画效果,而当这个动画效果还没结束时,用户就将光标移除这个元素了,那么光标移除胡动画效果将会被放进队列之中,等待光标移入的动画结束后再执行.因此如果光标移入移除得过快就会导致动画效果与光标的动作不一致. 方法一:用stop() $(function () { $(".ListFirs…

基于 jQuery 实现垂直滑动的手风琴效果

今天我们要与大家分享一个漂亮而灵活的垂直 jQuery 手风琴效果.其主要思想是扩大手风琴片上的点击和显示更多的信息.其他内容片段将变得不那么透明.当使用一个导航箭头导航下一个片段,新的片会从顶部或底部滑动. 效果演示插件下载 HTML 示例代码: <div id="va-accordion" class="va-container"> <div class="va-nav"> <span class=&q…

jquery mobile左右滑动切换页面

jquery mobile左右滑动切换页面 $(function() {$("body").bind('swiperight', function() { $.mobile.changePage("#foo", {transition: "slide", reverse:true},false);}).bind('swipeleft', function() { $.mobile.changePage("#bar", {…

用Jquery做一个时间日期选择器

今天我们就用Jquery做一个时间日期选择器,当打开网页时,文本框里面显示的是当前的日期,点击文本框可以出现年.月.日的下拉菜单,并且可以选择,会根据年份的选择判断是否是闰年,从而改变二月的天数,闰年的2月是29天,不是闰年的2月是28天.并且4.6.9.11月份天数是30天,其他月份的天数是31天,这个一定要判断好. 首先我们看看主页面的代码是如何书写的: <!doctype html> <html lang="en"> <head> <me…

简单的用jQuery做遮罩效果

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>用jquery做遮罩</title> <style> .all{ width:100%; height:500px; background: red; position: relative; } .mask { width:100%; height:…

基于jQuery鼠标滚轮滑动到页面节点部分

基于jQuery鼠标滚轮滑动到页面节点部分.这是一款基于jQuery+CSS3实现的使用鼠标滚轮或者手势滑动到页面节点部分特效.效果图如下: 在线预览源码下载实现的代码. html代码: <section class="panel home" data-section-name="home"> <div class="inner"> <header> <h1></h1> <…

基于jQuery图片遮罩滑动文字切换特效

基于jQuery图片遮罩滑动文字切换特效.这是一款jquery hover鼠标滑动选项卡切换透明背景遮罩文字显示特效.效果图如下: 在线预览源码下载实现的代码. html代码: <div class="bodyCon07"> <div class="teacher"> <div class="teacherPic"> <div class="content"> <i…

用js和jQuery做轮播图

Javascript或jQuery做轮播图 css样式 <style> a{ text-decoration:none; } .naver{ width: 100%; position:relative; } .images{ position:relative; width: 100%; height: 400px; } .images img{ position:absolute; left: 0; top: 0; width: 100%; height: 400px; opacity:…