原创 鼠標移動3D翻轉動畫特效

好久沒有更新文章咯,今天我爲大家帶來一個酷炫的3D翻轉特效效果例子(該效果是用的純html+css3實現的哦) 特別指示: 1、用到咯;perspective a) perspective屬性設置鏡頭到元素平面的距離。所有元素都是放置

原创 css3百葉窗效果

經常我們在瀏覽一些網頁的時候可能都會看見一些很酷炫的特效,比如百葉窗效果。以前的大多都是js寫出來的,但是自從CSS3出來之後,我們也可以用css代碼直接實現百葉窗效果。唉美中不足就是ie9以下不支持我們這個很炫的效果,這時你可以用js

原创 推廣一個良好的拼接帶格式字符串的方法

帶格式是指,像普通的HTML文檔一樣,有縮進,有換行,有空格,這種字符串更便於閱讀。大家拼innerHTML的時候,巴不得越容易閱讀越好。 JS拼字符串,一般喜歡用+。如果想要很多行拼在一起,且方便閱讀,一般的做法是: 1 2 3

原创 模擬支付寶支付

以前在我沒有編寫設置支付密碼的時候,以爲這種效果(js)很好實現,結果當我做的時候佈局到時很簡單,可是在用js的時候弄的我一個頭是兩個大。 第一次我是用一個input框,然後設置input的最大長度爲6,然後用letter-space設置

原创 loading css3動畫

現在很多的網站網頁在加載的時候都有一個加載的動畫標識,有些事用gif動畫圖片,有些使用存css3寫的,還有一些是使用js實現的,今天我就來用存css3來寫一個加載的動畫效果。 該效果使用咯css3的transform 裏面的scale(縮

原创 transform-style ~ animation (css3星環運動)

transform--style屬性指定嵌套元素是怎樣在三維空間中呈現。 值 描述 flat 子元素將不保留其 3D 位置。 preserve-3d 子元素將保留其 3D 位置。   然後我就自己用這個屬性寫咯一個比較炫的

原创 封裝輪播插件

以前寫網頁遇到輪播的時候,要麼是引用別人已經封裝好的插件(但是別人分裝好的存在在很多大量的代碼冗餘),要麼就是慢吞吞的自己寫js,有時候寫的佈局不一樣又要從新寫一個js,自從我學習咯寫封裝的juqery方法之後,我就在自己嘗試着封裝js,

原创 canvas繪製可愛貓咪

其他的廢話就不多說,效果和代碼都在下面<img alt="微笑" src="http://static.blog.csdn.net/xheditor/xheditor_emot/default/smile.gif" /><!DOCTYPE

原创 Less學習收穫

LESS 做爲 CSS 的一種形式的擴展,它並沒有閹割 CSS 的功能,而是在現有的 CSS 語法上,添加了很多額外的功能,所以學習 LESS 是一件輕而易舉的事情,果斷學習之! 變量 很容易理解: @nice-blue: #5B8

原创 JS正則表達式總結

正則需要傳參時,必須使用new RegExp(); var re = new RegExp('\\b'+sClass+'\\b'); -------------------------------------------------

原创 深入理解CSS過渡transition

通過過渡transition,可以讓web前端開發人員不需要javascript就可以實現簡單的動畫交互效果。過渡屬性看似簡單,但實際上它有很多需要注意的細節和容易混淆的地方。本文將介紹和梳理關於CSS過渡的知識   定義  

原创 倒計時、計算時間

哈哈,最近我們公司在做雙十一的優惠活動項目,現在距離雙十一還有幾天,所以我們需要做一個倒計時的功能,很榮幸的我完成咯這項艱鉅而偉大的任務,以前我在做Date()的時候老是把getDay( )(一週中的某一天)、getTime()(返回19

原创 微信網頁添加分享到朋友圈、發送好友JS代碼

微信公衆平臺開始支持前端網頁,大家可能看到很多網頁上都有分享到朋友圈,關注微信等按鈕,點擊它們都會彈出一個窗口讓你分享和關注,這個是怎麼實現的呢?今天就給大家講解下如何在微信公衆平臺前端網頁上添加分享到朋友圈,關注微信號等按鈕。   微