iteye_6992-优快云博客

元素的拖拽与重排

<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style type="text/css"> ul, li, div, span, img{margin

2014-01-04 12:53:53 189

常用示例

1）js//判断滚动停止demo var aa = $(window).scrollTop(); var tt; var bb = 0; $(window).bind('scroll', function(){ bb = $(window).scrollTop(); if(tt == null){ tt = setI...

2014-01-02 15:20:30 327

鼠标移动选择元素

x轴方向的4种情况，y轴方向也有类似的4种情况<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>图片选择</title> <style> .queue-item{position:rela

2013-11-25 14:54:39 185

原创 iframe的一些用法

parent.html页面：<!DOCTYPE html><html><head> <title></title> <style> #if{background-color: #e1e1e1;} </style></head><bod

2013-11-20 10:23:58 163

仿百度百科的页面导航效果

这周不小心看到了百度百科的页面导航效果，感觉挺不错的，周末抽空写了下。下图为导航部分的效果图：css和图片都是抄百度的，可从附件下载。具体的代码如下：20131128 改进版；暂不支持IE6<script> var allEle = $(':header[class*="headline"]'); var headLen = allEle.len...

2013-11-10 14:26:52 764

模拟下拉框

调用方式：$("select[data-class]").selectModel();;(function ($, window, document, undefined) { "use strict"; var pluginName = "selectModel", defaults = { effect: { ...

2013-10-21 17:07:24 105

文本两端对齐

<!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>&lt

2013-09-22 16:53:39 120

IE6 select 浮层遮盖

<!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>&l

2013-09-22 16:52:28 126

鼠标指针样式自定义控制

<!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

2013-09-22 11:17:13 974

2中跨浏览器placeholder实现

1： <style> .grey { color: #999; } .blue { color: blue; } </style><input id="t1" type="text" placeholder="请输入文字1" value="内容"/

2013-09-18 17:06:39 135

XMLHttpRequestd对象的abort()方法

<script type="text/javascript" src="jquery-1.9.1.js"></script><script>/*$.ajax 函数返回它创建的 XMLHttpReque

2013-09-02 14:10:34 1391

元素半透明

2013-08-28 16:52:31 91

通过$.data判断，并执行函数

<select id="s"> <option>1</option> <option>2</option></select><script type="text/javascript" src="jquery-1.9.1.js"></

2013-08-27 09:43:57 173

live,on,bind执行顺序

//live方法在jquery1.9以后的版本已经弃用，但在之前的版本中还可以使用。//今天遇到一个问题，检测代码都没有什么问题，最后发现是执行顺序的问题。//总结如下： <div class="a"> aaa <div class="b"> bbb </div></div><i

2013-08-15 14:30:35 139

css实现在文本溢出时，显示省略标记（...）

属性：强制换行： 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; paddi...

2013-08-05 14:58:08 164

原创 ie兼容 New Date（）内有参数

//NewDate函数用于解决ie浏览器，不支持new Date（）里面有参数 function NewDate(str) { str = str.split('-'); var date = new Date(); date.setUTCFullYear(str[0], str[1] - 1, str[2]); ...

2013-08-02 16:09:32 175

三角型的常见写法及旋转

三角型的常见写法，及三角的旋转 <style>div{ margin:50px;}.triangle{ width:0; height:0; border-width:30px; border-style:solid; border-color:red blue yellow green; overflow:hidden;}.tri...

2013-07-21 21:26:39 313

原创 css编写时的小细节

1、<input type='button' id='btn' />css代码#btn{text-indent:-9999px; *line-height:200px; *over-flow:hidden;}注释：对于input标签的text-indent属性为负数时，ie6，7下的效果会使input本身也消失了，用line-height和over-flow可以达到相同...

2013-07-19 21:53:43 132

原创获取IE浏览器的版本号

//获取IE浏览器的版本号//返回数值，显示IE的主版本号function getIEVer() { var ua = navigator.userAgent; //获取用户端信息 var b = ua.indexOf("MSIE "); //检测特殊字符串"MSIE "的位置 if (b < 0) { return 0; } ...

2013-06-21 11:15:25 234

div-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

2013-05-07 21:21:35 161

表格添加行，删除行通用方法

//表格添加行，删除行通用方法：//评标办法/** 参数意思： tabId:表格的id值； rowNum:添加行，删除行所在行即tr的id值； tdRows:数组，当添加行时，需要增加某些td的rowSpan时，把这些td的id放在一个数据中，当不需要时，数据为空，即[]； startId:增加行数，各个新增td的id值的起始id值； hidId:隐藏域的值； cellArr:数组，...

2013-04-26 10:17:06 210

jquery插件的编写（放置于Github）

1：scrollDiv 点击div框使页面滚动到顶部或底部，可根据参数不同，创建不同的div样式；https://github.com/keimon/scrollDiv1.git2：创建表格，可以根据参数的不同，创建各种的表格样式；https://github.com/keimon/createTable.git3：创建滚动条；https://github.com/keimon/progr...

2013-03-25 13:37:16 153

页面滚动定位效果

今天无意间看到了360导航-右侧页面滚动定位效果，发现他们做的火箭上升的效果挺有趣的，就模仿了一个类似的。在IE8，ff，opera中测试可以；具体代码如下：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional...

2013-03-21 16:39:48 212

jquery-简单插件编写

<!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

2013-03-21 14:16:37 102

jquery-选择城市

<!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

2013-03-21 10:39:32 195

鼠标移动形成选择框-选择checkbox

<!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

2013-03-20 16:50:39 694

Javascript-表格行-添加，删除

Javascript处理表格行的添加，删除，及重载时新增行的处理；具体代码如下：<SCRIPT type=text/javascript src="mdbDataBase.js"></SCRIPT><script> //添加行； function addRow(tabId,rowNum,tdRows,startId,hidId){ var t...

2013-03-15 15:52:02 103

Javascript-处理mdb数据库

用js操作mdb数据库的一些操作，包括数据的读取和存储；html页面信息 mdb数据库表一mdb数据库表二具体代码如下：//获得fileName的路径；function serverMapPath(fileName) { var syspath = location.href; //file:///c:/Documents%20and%20Settings/Administr...

2013-03-15 11:24:44 1987

IE兼容-png图片

IE6不支持png格式的透明图片，网上有很多修复此bug的方法，个人感觉IE滤镜方法最为简单。实例代码如下：<style>div{ width:900px; height:400px; position:relative;}#div2{ position:absolute; left:0; top:0; background-image: url(2.png)!imp...

2013-03-13 11:19:36 179

IE兼容-模拟IE6的position：fixed属性

IE6不支持position：fixed属性，查找发现有几种方法可以实现该属性，但因为对js较熟悉，就用position：absolute和js来模拟ie6的fixed属性。示例代码如下：<style>*{ margin:0; padding:0;}#div1{ position:relative; width:200px; height:200px; backgroun...

2013-03-12 10:42:56 102

在网页中有很多左右结构的标题，在一行的左边是“标题”，右边则是“更多”，在IE6,7中，如果处理不当则会出现右边的文字“更多”出现在下一行。究其原因是float：right的问题。下面是几种解决方法，可根据情况来选择，当然也可以有其他更好的办法。1：使一行中的元素全部浮动起来，如在这里，我们可以让第一个span元素增加float：left属性。2：用绝对定位代替浮动，如在这里，让div元素获得...

2013-03-09 09:42:13 141

IE兼容-div默认高度bug

IE6下默认的字体大小至少是12px；当你设置的div的高度小于这个值时，IE6会自动调节它默认的高度。要解决这个问题，可以在设置div高度的同时，设置字体的大小，也可以通过设置overflow：hidden来使div的高度显示为设定的值；示例代码如下：<style>div{ width:300px; height:2px; background-color:#000; ...

2013-03-08 10:17:48 134

IE兼容-line-height

在ie6下，当元素设置了height值和line-height值时，元素的实际高度按两者中大的那个来定的。而在其他浏览器中元素的高度只与height值有关，line-height的值只会影响元素中内容如文字在元素中的位置。示例代码如下：<style>div{ height:30px; line-height:40px; width:40px; bord...

2013-03-07 22:15:21 352

IE兼容-绝对定位

ie6，ie7在进行绝对定位时，必须同时设置left（right）和top（bottom）值。代码如下：<style>*{ margin:0; padding:0;}div{ width:166px; height:122px; border:1px solid #000; position:relative;}p{ position:absolute; bot...

2013-03-07 10:31:30 1014

IE兼容-z-index

今天在做页面的时候，发现要显示的元素在ie6，7中一直位于其他元素的下面（图片元素特别明显），该元素已经设置position：absolute；z-index：9999；其父元素也设置了position：relative；z-index：9998；显示效果如下左。后经学习发现ie6，ie7有同样的bug，虽然父级元素设置了z-index属性，但父级的父级元素未设置z-in...

2013-03-06 21:45:06 176

仿天猫图片展示效果2

<!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

2013-03-06 11:29:59 121

学习 jquery-1.9 的API

1、deffered对象：http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html-------------------------------------------------------------------------------------------...

2013-02-04 17:13:19 91

常见三级菜单

核心jquery代码：$(function(){ $('.topH li').mouseenter(function(){ var that = $(this); var index = $('.topH li').index(that); $('.topH li').removeClass('activeLi').eq(index).addClass('...

2013-01-31 16:55:28 106

各浏览器兼容方法总汇

1：css-hack；2：条件注释判断浏览器：例如：<script> //IE 6 会alert 2 次，其他浏览器只 alert 第一个 alert('other');</script><!--[if IE 6 ]><script type="text/javascript" defer="defer" async="true&quot

2013-01-31 11:16:12 123

综合图片展示效果

<!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><m

2013-01-30 16:50:04 145

空空如也

空空如也