Time of Update: 2015-10-19
jQuery實現商品活動倒計時,jquery商品倒計時倒計時一般是用來表示未來某一時刻距現在時刻還剩多少時間。倒計時在WEB上應用非常廣泛,如考試系統倒計時,團購網站中的優惠活動倒計時等等。今天,我們來使用jQuery實現一個簡單的倒計時功能。本文以團購網站的倒計時為背景,我們知道,網站會給每個優惠活動(商品)定一個結束時間,也就是到期時間,但系統時間到達了結束時間,就意味著活動結束。因此,我們在HTML中就要定義活動的結束時間。HTML<ul class="prolist">
Time of Update: 2015-10-19
兩款JS指令碼判斷手機瀏覽器類型跳轉WAP手機網站,jswap隨著行動裝置的普及,企業的網路宣傳已經不能局限在PC端,而需要同時在移動端有所建樹。對於公司網站來說,以前都是做的PC端的,當然手機等移動端也可以訪問,但是使用者體驗肯定不如完全適合的手機端來的方便。我們在給自己的網站做了WAP手機網站之後,如果有使用者通過手機訪問我們的企業頂級網域名稱網站,那就判斷跳轉到專為的WAP網站。這裡老左整理到目前自己在使用的2種JS指令碼,因為之前一直有朋友跟我要,所以這裡分享出來。第一種:直接JS指令碼
Time of Update: 2015-10-19
javascript實現3D切換焦點圖,javascript3d做了一個用滑鼠拖拽配合 CSS3 的小嘗試,如下:熟悉拖拽效果的朋友應該不會陌生滑鼠按住以後,左右拖動的實現方式。這個小demo裡嘗試的是把CSS3中的相關知識點運用到圖片展示中,當拖動圖片時,顯示出立體的感覺~~直接代碼如下:#list{ width:400px; height:440px; margin:30px auto 30px; position:relative;z-index:500;}#list li{height:
Time of Update: 2015-10-19
js實現新浪微博首頁效果,js新浪博首頁我們先來看下CSS* { padding: 0; margin: 0; }li { list-style: none; }body { background: #eee; }#t_sina { width: 390px; padding: 10px; background: #fff; margin: 50px auto 0; font-size: 12px; border: 1px solid #ccc; }#t_sina h2 { padding: 1
Time of Update: 2015-10-19
jQuery實現帶漸顯效果的人物多級關係圖代碼,jquery漸顯本文執行個體講述了jQuery實現帶漸顯效果的人物多級關係圖。分享給大家供大家參考。具體如下:這裡示範jQuery實現帶漸顯效果的人物多級關係圖,setQuestPose:function中的n代表共幾個對象 r代表周長 i代表第幾個對象 w代表外面對象的寬頻 h代表外面對象的高度
Time of Update: 2015-10-19
js產生隨機數的方法執行個體,js隨機數執行個體js產生隨機數主要用到了內建的Math對象的random()方法。用法如:Math.random()。它返回的是一個 0 ~ 1 之間的隨機數。有了這麼一個方法,那產生任意隨機數就好理解了。比如實際中我們可能會有如下的需要:(1)產生一個 0 - 100 之間的隨機整數,那麼則可以:parseInt(100*Math.random());
Time of Update: 2015-10-19
javascript判斷複選框是否選中的方法,javascript複選框之前總結了一下關於jquery如何判斷複選框是否選中的問題,今天總結如何判斷js複選框是否選中javascript判斷複選框是否選中,下面通過例子來說明(現在有如下的一組複選框):<input type="checkbox" name="fruit" value="apple" />蘋果 <input type="checkbox" name="fruit" value="orange" />橘子 &
Time of Update: 2015-10-19
基於jQuery實現的菜單轉場效果,jquery實現切換這是一個非常流暢的菜單展示效果,應用在亞馬遜上,當你上下移動滑鼠的時候,二級菜單會非常輕快的切換,沒有任何延時,給使用者如滑絲般的感覺。這種效果藉助於一款jQuery外掛程式menu-aim,本文將結合執行個體講解如何?速度超快的菜單效果。HTML首先建立主菜單,我們借用電商網站常見的商品分類。其html結構代碼如下,其中我們用到了html5的data-submenu-id屬性設定,這在外掛程式調用時非常有用。<div class="
Time of Update: 2015-10-19
JavaScript各類型的關係圖解,javascript各類型內建(Build-in)對象與原生(Naitve)對象的區別在於:前者總是在引擎初始化階段就被建立好的對象,是後者的一個子集;而後者包括了一些在運行過程中動態建立的對象。此外,補充一中用到的概念:1、內建(Build-in)對象與原生(Naitve)對象的區別在於:前者總是在引擎初始化階段就被建立好的對象,是後者的一個子集;而後者包括了一些在運行過程中動態建立的對象。2、引擎擴充項物件是一個並不太大的集合,一般來說比較確定,它們也屬
Time of Update: 2015-10-19
基於jquery實現複選框全選,反選,全不選等功能,jquery全選jquery 實現全選,反選,全不選等功能,下面直接以例子進行說明。設頁面有如下一組複選框和幾個相關按鈕(全選,反選,全不選等):<input type="checkbox" name="fruit" value="apple" />蘋果 <input type="checkbox" name="fruit" value="orange" />橘子 <input type="checkbox"
Time of Update: 2015-10-19
JS類比Dialog彈出浮動框效果代碼,jsdialog本文執行個體講述了JS類比Dialog彈出浮動框效果代碼。分享給大家供大家參考。具體如下:這裡示範JS類比Dialog彈出浮動框,藍色經典風格,可以建立一個新層,可設定彈出層的標題和內容,用它可實現一個登入框,或用在後台管理中。運行效果如下:線上示範地址如下:http://demo.jb51.net/js/2015/js-mn-dialog-float-dlg-style-demo/具體代碼如下:<!DOCTYPE html
Time of Update: 2015-10-19
jQuery實現有動畫淡出效果的二級摺疊菜單代碼,jquery淡出本文執行個體講述了jQuery實現有動畫淡出效果的二級摺疊菜單代碼。分享給大家供大家參考,具體如下:這裡介紹jQuery實現有動畫淡出效果的二級摺疊菜單代碼,相當不錯,因考慮功能的實現,所以沒有怎麼美化,不過這樣也好,可以給大家更多的空間來修飾美化,想怎麼弄就怎麼弄了。運行效果如下:線上示範地址如下:http://demo.jb51.net/js/2015/jquery-dh-flash-fade-in-out-2-menu-de
Time of Update: 2015-10-18
sunny day,sunny初始學習記錄 基於http://www.htmleaf.com/html5/html5muban/20141121552.html模板<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>標題</title> <style>button{ background: #686
Time of Update: 2015-10-19
學習javascript的閉包,原型,和匿名函數之旅,javascript之旅本文通過樣本給大家介紹javascript的閉包,原型,和匿名函數,具體詳情請看下文。一 .>關於閉包理解閉包 需要的知識1.變數的範圍例1:var n =99; //建立函數外的全域變數function readA(){ alert(n); //讀取全域變數}readA(); //執行此函數例2:function readB(){ var c = 9; function readC(){
Time of Update: 2015-10-19
JavaScript實現的背景自動變色代碼,javascript變色代碼本文執行個體講述了JavaScript實現的背景自動變色代碼。分享給大家供大家參考,具體如下:這裡示範JavaScript實現網頁背景自動變色,自己變換顏色,設定時間和顏色值即可,在你設定的顏色值、一定時間內自動切換網頁背景顏色。運行效果如下:線上示範地址如下:http://demo.jb51.net/js/2015/js-auto-cha-bg-color-demo/具體代碼如下:<!DOCTYPE HTML
Time of Update: 2015-10-18
JS實現選中當前菜單後高亮顯示的導航條效果,高亮顯示導航條本文執行個體講述了JS實現選中當前菜單後高亮顯示的導航條效果。分享給大家供大家參考。具體如下:這裡示範選中當前菜單後,該菜單高亮顯示,也就是說在不改變菜單CSS代碼的情況下,用JavaScript去控制功能表的背景,如果該功能表項目被點擊後,將賦予它一個與眾不同的背景顏色或背景映像,這樣可以清淅的指引使用者下在瀏覽的網站欄目,本菜單不需要動態語言的加入,簡單方便而且效果好。運行效果如下:線上示範地址如下:http://demo.jb51.
Time of Update: 2015-10-18
jQuery實現仿QQ線上客服效果的滾動層代碼,jquery線上客服本文執行個體講述了jQuery實現仿QQ線上客服效果的滾動層代碼。分享給大家供大家參考。具體如下:這是一款jQuery滾動層,可以做成仿QQ線上客服,雖然效果有點生硬,但水平就這麼高了,彈出層是挺實用的,期待大家有新的改進。運行效果如下:線上示範地址如下:http://demo.jb51.net/js/2015/jquery-f-qq-online-style-scroll-style-demo/具體代碼如下:<!DOCT
Time of Update: 2015-10-17
如何垂直置中一個<img>?,垂直置中img<!doctype html><html> <head> <meta charset="UTF-8"> <meta name="Author" content="胡超"> <title>super胡</title> <style> #a1{ display:table-cell; text-align:center;
Time of Update: 2015-10-19
AngularJS 實現按需非同步載入執行個體代碼,angularjs非同步AngularJS 通過路由支援多視圖應用, 可以根據路由動態載入所需的視圖, 在 AngularJS 的文檔中有詳細的介紹, 網上也有不少教程, 就不用介紹了!隨著視圖的不斷增加,js檔案會越來越多,而 AngularJS 預設需要把全部的js都一次性載入,使用起來非常不便, 因此按需載入模組的需求會越來越強,不過,AngularJS 並沒有實現按需載入。習慣了 seajs 的非同步載入方式,也想著 angular
Time of Update: 2015-10-18
jquery實現簡單實用的彈出層效果代碼,jquery簡單實用本文執行個體講述了jquery實現簡單實用的彈出層效果。分享給大家供大家參考。具體如下:目前來說,我還是喜歡這個自己改造的彈出層,在項目中用的也是這個。引入了新版的jquery外掛程式,方框及文字都可以自己定義,非常方便,希望大家也喜歡這款彈出層,JavaScript在本例中也充分發揮了作用,對學習JS也是不錯的參考。運行效果如下:線上示範地址如下:http://demo.jb51.net/js/2015/jquery-simple-