keimon
- 浏览: 74756 次
- 性别:
- 来自: 上海
-
最新评论
-
ch2004：
...
仿百度百科的页面导航效果 -
y_hai_n：
需要再加一个jquery.min.js，效果就出来了，谢谢分享 ...
仿百度百科的页面导航效果 -
liu621java：
t=exp(2)*L*cos(degree)-L; 能详细的解 ...
两种图片360度旋转方法的比较 -
town2you：
代码很好用，谢谢！不过有个小问题不知道怎么弄：右边导航栏是固 ...
仿百度百科的页面导航效果 -
town2you：
很好用，谢谢了！
仿百度百科的页面导航效果
文章列表
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style type="text/css"> ul, li, div, span, img{margin: 0; padding: 0;} #mydiv { width: 900px; background-color: #fff; ...
常用示例
- 博客分类：
- jquery-demo
- div-css
1）js
//判断滚动停止demo
var aa = $(window).scrollTop(); var tt; var bb = 0; $(window).bind('scroll', function(){ bb = $(window).scrollTop(); if(tt == null){ tt = setInterval(function(){ aa = $(window).scrollTop(); if(aa == bb){ ...
x轴方向的4种情况，y轴方向也有类似的4种情况
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>图片选择</title> <style> .queue-item{position:relative;border:1px solid #dedede;padding:1px;background:#fff;display:inline-block;*display:inline;*zoom: ...
iframe的一些用法
- 博客分类：
- jquery
parent.html页面：
<!DOCTYPE html><html><head> <title></title> <style> #if{background-color: #e1e1e1;} </style></head><body><div id="parentDiv"> this id parent div;</div><iframe id="if" width=42 ...
这周不小心看到了百度百科的页面导航效果，感觉挺不错的，周末抽空写了下。
下图为导航部分的效果图：
css和图片都是抄百度的，可从附件下载。
具体的代码如下：
20131128 改进版；
暂不支持IE6
<script> var allEle = $(':header[class*="headline"]'); var headLen = allEle.length; var ddArr = []; //根据页面内容生成slide导航； allEle.each(function(i){ var sideIn ...
调用方式：$("select[data-class]").selectModel();
;(function ($, window, document, undefined) { "use strict"; var pluginName = "selectModel", defaults = { effect: { "type": "standard", "speed" ...
<!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-Type" content="text/html; charse ...
<!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-Type" content="text/html; chars ...
<!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-Type" content="text/html; charset=utf ...
1：
<style> .grey { color: #999; } .blue { color: blue; } </style><input id="t1" type="text" placeholder="请输入文字1" value="内容"/><input id="t2" type="text" placeholder ...
<!--1.html中内容<div id="test"> 111</div>--><script type="text/javascript" src="jquery-1.9.1.js"></script><script>/*$.ajax 函数返回它创建的 XMLHttpRequest 对象。通常 jQuery 只在内部处理并创建这个对象，但用户也可以通过 xhr 选项来传递一个自己创建的 xhr 对象。返回的对象通常已经被丢弃了，但依然提供一个底层接口来观察和操 ...
<style>
/*指定元素透明*/
.a{
background-color: rgba(0, 0, 0, 0.4); filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr=#88000000, endColorstr=#88000000);
}
/*指定元素内全部内容透明*/
.b{
filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity:0.5; opacity:0.5;
}
.b{
back ...
<select id="s"> <option>1</option> <option>2</option></select><script type="text/javascript" src="jquery-1.9.1.js"></script><script>//通过$.data判断，并执行函数；var defaults = { name:'a', age:'29' }function ...
//live方法在jquery1.9以后的版本已经弃用，但在之前的版本中还可以使用。
//今天遇到一个问题，检测代码都没有什么问题，最后发现是执行顺序的问题。
//总结如下：
<div class="a">
aaa
<div class="b">
bbb
</div>
</div>
<input type="button" value="btn" id="btn" />
< ...
属性：强制换行：
word-wrap:break-word; word-break:break-all; white-space:pre-wrap; 强制不换行：
overflow:hidden; width:300px; white-space:nowrap; text-overflow: ellipsis;
<style>* { margin: 0; padding: 0; } a { text-decoration: none; color: #000; } ul { width: 300px; margin: 40px auto; ...