jquery实现图片随机排列的方法
本文实例讲述了jquery实现图片随机排列的方法。分享给大家供大家参考。具体如下:
该代码可刷新后实现图片随便排列的jQuery特效
test body{ background:#CCCCCC; padding:0; margin:0; } #reset{ width:898px; height:36px; margin:0 auto; position:relative; color:#FFFFFF; font-size:28px; line-height:36px; font-weight:bold; } #reset span{ cursor:pointer; text-decoration:underline; } #c_u{ width:898px; height:596px; margin:0 auto; position:relative; list-style:none; padding:8px; border:4px solid #FFFFFF; } #c_u li{ margin:8px; border:4。
5px solid #FFFFFF; width:125px; height:125px; position:absolute; padding:0; transition:all 。5s ease-out 0s; -webkit-transition:all 。
5s ease-out 0s; -o-transition:all 。5s ease-out 0s; } #c_u li{cursor:move;} #c_u li。red{border-color:#FF99CC;} #c_u li。
move{position:fixed;} #c_u li。abs{position:absolute;} #c_u li img{vertical-align:top;} #c_u 。li_0{top:8px; left:8px;} #c_u 。
li_1{top:8px; left:158px;} #c_u 。li_2{top:8px; left:308px;} #c_u 。li_3{top:8px; left:458px;} #c_u 。li_4{top:8px; left:608px;} #c_u 。
li_5{top:8px; left:758px;} #c_u 。li_6{top:158px; left:8px;} #c_u 。li_7{top:158px; left:158px;} #c_u 。li_8{top:158px; left:308px;} #c_u 。
li_9{top:158px; left:458px;} #c_u 。li_10{top:158px; left:608px;} #c_u 。li_11{top:158px; left:758px;} #c_u 。li_12{top:308px; left:8px;} #c_u 。
li_13{top:308px; left:158px;} #c_u 。li_14{top:308px; left:308px;} #c_u 。li_15{top:308px; left:458px;} #c_u 。li_16{top:308px; left:608px;} #c_u 。
li_17{top:308px; left:758px;} #c_u 。li_18{top:458px; left:8px;} #c_u 。li_19{top:458px; left:158px;} #c_u 。li_20{top:458px; left:308px;} #c_u 。
li_21{top:458px; left:458px;} #c_u 。li_22{top:458px; left:608px;} #c_u 。li_23{top:458px; left:758px;} Reset:
希望本文所述对大家的jQuery程序设计有所帮助。
答:首先先把所有的字都给遮挡住,可用环形快速的挡掉。 调整空心弧的厚度和角度,如下效果。挡住所有的字,将蓝色设置为白色。 接着输入需要重新录入的文字信息。牛闪闪录入...详情>>
答:微软开发的类似于Flash的,技术是一种新的Web呈现技术,能在各种平台上运行。是一种HTML4向HTML5的过渡技术,现在应用不是很广,主要借助微软.NET技...详情>>
答:3、语法(syntax):包括数据格式、编码及信号电平等详情>>