在網頁中常用的css和js代碼,必須收藏 

美国职业棒球比分多少结束 www.996022.live 2015-04-23 20:58 發布

1393 0 0
不管是作為站長還是設計師來說,一些簡單的css和js效果是必備的,而很多情況我們并不了解,這篇文章應該是總結了目前主流效果,是從國外網站上找到,分別配備了演示圖和源文件下載,必須收藏,因為一些介紹文字是英文的,可以用google瀏覽器的翻譯工具學習

因為每個文件都可以整套下載有源碼存在,所以下載后馬上就可以使用了。


固定背景效果

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
在Section和div垂直配置的長頁面中,把背景固定,像卷簾被提起似的滾動。



產品展示滑塊

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
把配置卡片狀的各個產品,用很棒的動畫效果來展示。


CSS內容框

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
文本輸入,文本錯誤,按鈕,復選框,下拉選框等,把表單元素簡單組裝到一起,也有可以自定義的代碼片段。


二級滑動導航

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
臺式機的時候導航在上部展示,手繪板和手機的時候變成圖標展示,如果點擊導航會滑出。

視覺差圖片

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
瀏覽器被填滿,加上與頂層圖片的視覺差效果。有視覺差是因為不同元素滑動的時機改變了,這是鼠標移動帶給我們的視覺差效果。

推出全屏導航

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
點擊圖標,滑動彈出布滿整個瀏覽器的導航菜單。


彈出導航

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
全屏的導航有很棒的彈跳效果,消失的時候也是很棒。


變形窗口模式

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
如果點擊按鈕,由按鈕開始改變窗口模式。


CSS頁碼

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
即使對手機也是友好的,適用于響應式的頁碼,有很多編輯樣例。

內容篩選

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
在篩選的過程中卡片狀的??榛嵊瀉馨艫畝?。手機也可以適用。

3D幕布效果模板

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
各內容垂直分布,幕布從兩側向中間關閉,沿z軸分割的內容向中間匯聚。

可擴展項目的報告

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
在臺式機上是水平分割,在手機上是垂直擺放。點擊縮略圖的區域項目會占滿整個瀏覽器。

CSS動畫標題

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
使用CSS動畫,讓原文更顯眼。

圖片膨脹

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
如果點擊縮略圖會變成和瀏覽器一樣大的滑塊。在手機上一開始就是滑塊。

3D翻轉導航

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
在臺式機和手機上,頁面頂部的導航條用3D旋轉動畫展示。

3D動畫模型

→效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
用于手機等的宣傳模板。用3D動態效果展現的全尺寸模型,各個部位也有的引導功能。

CSS Mega-Site導航

效果頁
適用的瀏覽器:Chrome,Safari,Firefox,Opera,IE9+
用css編碼適用于響應式的巨大尺寸的大型導航。并且享受著帶有精妙動畫的操作。

翻譯:SISENdesign
出典:
//coliss.com/articles/build-websites/operation/work/newest-web-development-tutorials-2015-spring.html

-------------------------------------------------------------------------------------------------

翻譯的文章可能不是很驚喜,請多多關照,如果有問題,可以回帖,會為您解答









聯系
我們
快速回復 美国职业棒球比分多少结束 返回列表
{ganrao}