最近更新

JavaScript案例7:有小圆点导航和缩略图的幻灯片切换(两个版本)

JavaScript案例7:有小圆点导航和缩略图的幻灯片切换(两个版本)
很多幻灯片切换的时候,下面有一个对应的小圆点导航条。这种案例的关键点是各自的下标传递,依然要用到自定义属性。功能有:1、点击下一张和上一张切换大图。2、下面导航的小圆点的active高亮状态随着大图的...

JavaScript案例6:有缩略图的幻灯片切换(有两个版本)

JavaScript案例6:有缩略图的幻灯片切换(有两个版本)
幻灯片切换的案例中,如果不存在缩略图或者导航的小点点,一般只需要下标值的改变即可。 如果存在两组数据,而且数据之间必须有一一对应的关系时,就要依赖自定义属性的方法来传递各...

JavaScript案例5:QQ好友列表的展开和隐藏

JavaScript案例5:QQ好友列表的展开和隐藏
QQ好友列表的展开和隐藏效果。 第一个案例的功能是: 1、点击好友列表的标题,打开下面的好友列表,再次点击标题, 关闭列表。多个好友列表之间互不影响。 ...

JavaScript案例4:鼠标经过显示隐藏的内容

JavaScript案例4:鼠标经过显示隐藏的内容
这个案例有两个版本: 一个是把所有隐藏的内容都嵌入到了html结构中,这种方法很冗余,不利于数据的更新。 第二个方法是利用数组对象的方式,把数据放入数组...

JavaScript案例3:鼠标经过方块消失出现图片

JavaScript案例3:鼠标经过方块消失出现图片
这个案例主要是练习for循环生成阵列。 通过定位在图片上方摆满多个div,鼠标经过div消失。 案例下载地址: ...

JavaScript案例2:幻灯片切换效果(顺序切换和循环切换)

JavaScript案例2:幻灯片切换效果(顺序切换和循环切换)
幻灯片的切换是网站常用功能,这个案例包括了顺序切换和循环切换两种效果。 1、循环切换就是点击下一张,到了最后一张,偷偷摸摸切换到第一张。点击上一张,到了第一张,再偷偷摸摸...

JavaScript案例1:模仿微信界面发送信息

JavaScript案例1:模仿微信界面发送信息
开始JavaScript的案例更新了。 第一个案例是模仿微信界面发送信息。 1、点击头像可以模拟切换用户。 2、输入信息,点击发送可以...

checkbox复选框样式美化的问题

复选框,单选框都不好直接用css样式美化,总得用点奇思妙想才行。如果只考虑谷歌内核的浏览器的话,那么用appearance属性可以搞定大部分表单控件的样式。关键是这个appearance属性IE不支持,这就逼得大家另想办法了。利用label挂钩checkbox的特点来实现。当html代码中,labe...

select下拉菜单的兼容性问题,支持IE10以上的方法

对于表单控件的样式修改一直是个老大难的问题,如果不做大手术,还是很好兼容IE10和谷歌等现代浏览器的。有两种常规方法。第一种:直接干掉select旁边的小箭头,用图片或者border绘制三角形代替。chrome下面需要利用谷歌的私有属性-webkit-appearance完成。这个appearanc...

linear-gradient线性渐变的兼容性问题,有神器!

兼容性问题一直是让前端工程师脱发的主要罪魁祸首,所以,利用一些神器工具可以挽救你的发际线。先来一个兼容性全包括的代码片段,这是IE9不支持圆角的全系列:.gradient{ background: #d91915; /* Old browsers ...
Top