電子相簿特效

2021-09-06 23:17:05 字數 1343 閱讀 8017

初入前端這行不久,對很多東西還是很陌生,頁面布局、合理使用html標籤、css屬性、js書寫習慣等等還都不是很熟悉,所以看到感興趣的東西就想看看原始碼,看看實現原理,用來學習。 前幾天看到tattoo寫的乙個jquery版結婚電子請帖,對首頁的相簿效果感興趣,所以把原始碼開啟看了兩遍,自己再敲了一遍。

2、css3使用了屬性box-shadow、border-radius屬性。

3、相簿總體使用了postion布局, 共12張,分別用position:absolute固定位置。

4、按照索引順序放大和縮小。從容器中心位置開始放大,放大後間隔2秒,回到容器左上角,再依次回到原始位置。

當前第幾張正在進行放大或縮小。

16picleft,

17pictop;

1819

function

autopicwall()else

if(picpage == $picturewallpic.length - 1)35}

3637

function

becomebig($own,hasclasspicrow),2);

51 $own.animate(,2);52}

53 }else

,2);

56 $own.animate(,2);57}

58}59}

6061

function

becomesmall($own,hasclasspicrow),2);

69/*

縮小到中心位置

*/70 $own.animate(,2);71}

72 }else

,2);

75/*

縮小到中心位置

*/76 $own.animate(,2);77}

78}7980

/*縮小到中心位置後,回到原始位置

*/81 $own.animate(,400,function

());85}

8687 $(function

());

製作漂亮的三重捲動相簿特效動畫

又是乙個用flash製作的漂亮相簿的教程,還是那句話本站相簿的教程已經不少了!今天簡單給大家描述下這個相簿的製作過程。url 製作超酷的旋轉影象像冊視覺效果 url img files beyondpic 2007 7 23 20070723115534965.gif img 製作乙個影片剪輯當作該...

電子相簿之bitmap

位 件主要分為3部分 1.檔案資訊頭 14byte 2.位圖資訊頭 40byte 3.rgb顏色陣列 由影象長寬尺寸決定 1.檔案資訊頭 定義結構體 typedef struct tagbitmapfileheader bitmapfileheader bftype 必須是0x4d42 bfsize...

電子相簿系統(八)驗證使用者是否可用

我們的系統要求使用者名稱不能有重複的,所以使用者可以通過單擊 驗證使用者名稱是否可用 來驗證資訊。這裡也採用非同步請求的。如圖所示。學習了前面的相關知識之後,我想這個功能就不會很難了。這裡一樣的,也是通過我們業務層來查詢資料庫,然後對於不同的查詢結果做出不同的資訊反饋。1 jquery的檔案中,定義...