Time of Update: 2017-01-19
本文執行個體為大家分享javascript實現全屏漂浮廣告,供大家參考,具體內容如下主要使用方法網頁可見地區寬:document.body.clientWidth;網頁可見地區高:document.body.clientHeight;網頁可見地區寬:document.body.offsetWidth (包括邊線的寬);網頁可見地區高:document.body.offsetHeight
Time of Update: 2017-01-19
在javascript中,對象的屬性分為資料屬性和儲存空間屬性兩種:兩種屬性的區別我們使用Object.defineProperty()先來直觀的感受一下這兩者的不同。使用Object.defineProperty()對資料屬性進行設定的方法如下var obj = {};Object.defineProperty(obj, "prop", {value: 1,writable: true, //可寫性enumerable: true, //可枚舉性configurable: true
Time of Update: 2017-01-19
d3.bisector(accessor)是一種指定參數accessor或者比較子函數返回一個二等分對象。返回的對象有left和right兩個屬性。分別類似於bisectLeft和bisectRight方法。這個方法適用於對象數組而不適用於原始的簡單數組。N>>>1就代表N的二進位右移一位,二進位右移一位就能得到中間值。例如10>>>110的二進位代碼為 1010向右移動一位後為 0101即 5
Time of Update: 2017-01-19
最近做了一個前端項目,其中有需求:通過button直接把input或者textarea裡的值複製到粘貼板裡。下面小編把我實現思路及代碼分享給大家,大家可以直接引入項目中。具體代碼如下所示:function copyToClipboard(elem) {// create hidden text element, if it doesn't already existvar targetId = "_hiddenCopyText_";var isInput = elem.tagName === "
Time of Update: 2017-01-19
前言:大多OO語言都支援兩種繼承方式: 介面繼承和實現繼承 ,而ECMAScript中無法實現介面繼承,ECMAScript只支援實現繼承,而且其實現繼承主要是依靠 原型鏈 來實現。1.原型鏈基本思想:利用原型讓一個參考型別繼承另外一個參考型別的屬性和方法。建構函式,原型,執行個體之間的關係:每個建構函式都有一個原型對象,原型對象包含一個指向建構函式的指標,而執行個體都包含一個指向原型對象的內部指標。原型鏈實現繼承例子:function SuperType() {this.property =
Time of Update: 2017-01-19
在現在代瀏覽器中判斷一個元素在不在一個數組中,咱們可以用Array對象的indexOf()方法來取得這個元素在當前數組中的索引值,若索引值不等於-1,數組中就存在這個元素,例如:var arr = [2,53,23,'test',9,'array'];//判斷array在不在數組arr中arr.indexOf('array') !== -1 ? alert('存在') : alert('不存在');但是IE9以前的版本都不支援此方法,那咱們就只能擴充一個:
Time of Update: 2017-01-19
我們經常參加各種電商優惠活動,比如購買達到一定數額進行抽獎活動,在比如微信抽獎,淘寶抽獎,迅雷賺錢寶圓盤抽獎活動等。這些抽獎活動部分就是由HTML5的Canvas來製作的,今天就為大家分享一下如何使用HTML5的Canvas來製作圓盤抽獎功能。老規矩,先看下效果圖吧:再來看看Canvas的幾個主要api: 全部原始碼如下:<!DOCTYPE html><html lang="zh-cn"><head><meta charset="UTF-8"&
Time of Update: 2017-01-19
先給大家展示下效果圖: 向下滑動網頁的時候能夠自動載入圖片並顯示。 盛放圖片的盒子模型如下: <div class="box"><div class="box_img"><img
Time of Update: 2017-01-19
Javascript實現蘋果懸浮虛擬按鈕直接引入代碼到頁面即可代碼有部分冗餘的地方,有興趣的小夥伴可也自己修改如果有什麼BUG 記得評論 告訴我哦web-touch.jsvar new_element_N=document.createElement("style"); new_element_N.innerHTML = '#drager {' + ' position: fixed;' + ' width: 35px;' + ' height: 35px;'
Time of Update: 2017-01-19
HTML DOM 樹一、DOM簡介DOM是W3C制定的用於訪問諸如XML和XHTML等結構化文檔的標準。W3C文件物件模型(DOM)是一個使程式和指令碼有能力動態地訪問和更新文檔的內容、結構以及樣式的平台和語言中立的介面核心DOM:用於任何結構化文檔的標準模型XML DOM:用於XML文檔的標準模型。是用於擷取、更改、添加或刪除XML元素的標準。HTML DOM:
Time of Update: 2017-01-19
一、javascript是物件導向的程式設計語言封裝:把相關的資訊(無論資料或方法)儲存在對象中的能力聚集:把一個Object Storage Service在另一個對象內的能力繼承:由另一個類(或多個類)得來類的屬性和方法的能力。多態:編寫能以多種形態啟動並執行函數或方法的能力二、Array對象使用單獨的變數名來儲存一系列的值。2.1建立數組對象var aValues = new Array();var aValues = new Array(25);var aColors = new
Time of Update: 2017-01-19
對於H5來說,canvas可以說是它最有特色的一個地方了,有了它之後我們可以隨意的在網頁上畫各種各樣的圖形,做一些小遊戲啊什麼的。canvas這個標籤的用法,在網上也有特別多的教程了,這裡就不作介紹了。今天我們就用canvas來做一個小小的時鐘。完整的代碼在這裡https://github.com/wwervin72/HTML5-Clock。那麼首先在這個頁面裡面我使用了兩個canvas,一個用來繪製靜態時鐘錶盤和刻度,另一個用來繪製時鐘的三個指標,然後用定位讓他們重合到一起。然後這
Time of Update: 2017-01-19
本文為大家分享了javascript跨瀏覽器事件處理機制,供大家參考,具體內容如下<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>跨瀏覽器的事件處理常式</title></head><body> <input type="button" value="click me" id="myBtn"/>
Time of Update: 2017-01-19
本文為大家分享了做360度的全景相片的詳細步驟,其中要注意以下幾個問題:1、如何在拖圖片時,使其載入變快?---注意讓圖片隱藏的效能比讓圖片切換的效能高,且在IE9下運行,會出現圖片載入的問題2、如何使圖片帶有一定的速度轉3、考慮如果x為負數和負數兩種情況代碼如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
Time of Update: 2017-01-19
本文總結一下,拖拽所延伸出來的一些效果,供大家參考,具體內容如下1.實現拖拉圖片時,帶框的效果。即當滑鼠拖動某一個圖片或物體時,其原有位置扔保留其型。這種效果,其實很簡單,主要是另外建立一個物體,使其與被拖拽的物體,寬和高一樣,然後,將其變為拖拽的對象。直接上代碼:<html<head><style>#div1 {width:100px; height:100px; background:yellow; position:absolute;}.box{border:
Time of Update: 2017-01-19
本文為大家簡單介紹了javascript事件委託的用法及其好處,供大家參考,具體內容如下事件委託:利用冒泡的原理,把事件加到父級上,觸發執行效果,好處:提高效能,新添加的元素還會有之前的事件。event對象:事件來源,不管在哪個事件中,只要你操作的那個元素就是事件來源擷取事件來源:IE:window.event.srcElement 標準下:event.target target.nodeName來判斷是哪個標籤代碼應用如下:<!DOCTYPE html
Time of Update: 2017-01-19
本文為大家分享了做微博發布欄效果的過程,涉及到的知識點包括以下:1.判斷IE的方法:直接用 var ie=!-[1,];即可2.連續發生事件的用法: IE下:觸發對象.onpropertychange 標準下:觸發對象.oninput3.焦點聚集和移開事件。onfocus和onblur4.判斷單位元組(0-255之間)與雙子節:Regex:/[^\x00-\xff]/g代碼如上:<!DOCTYPE html PUBLIC "-//W3C//DTD
Time of Update: 2017-01-19
檔案上傳功能現在是越來越普遍,所有的社交網站,媒體網站,比如優酷視頻,微博等,都提供了上傳圖片,上傳視頻等功能。但過去WEB程式員都很清楚,用HTML表單上傳檔案是很麻煩的事情,特別是你想瞭解一下使用者上傳的檔案的一些屬性,必須等它上傳完成後才能知道。未知的東西上傳到伺服器上,有可能產生安全問題,也有可能體積太大,超過允許,浪費空間。現在好了,WEB技術在進步,HTML5帶來了很多好東西。這個FileReader
Time of Update: 2017-01-19
在javascript中根據變數作用的範圍不同分為局部變數和全域變數,直接定義的變數是全域變數,全域變數可以被所有的指令碼訪問;在函數中定義的變數是局部變數,局部變數只在函數內有效。如果全域變數和局部變數使用相同的變數名,則局部變數將會覆蓋全域變數。例子代碼:<!DOCTYPE html> <html> <head> <meta charset="utf-8">
Time of Update: 2017-01-19
本文內容分為兩個部分進行學習,分別介紹了javascript建立cookie、javascript讀取cookie的具體實現方法,供大家學習,具體內容如下一、建立Cookie document.cookie = 'key=value'; 有特殊字元 使用encodeURIComponent() 進行編碼document.cookie = 'user='+encodeURIComponent('郭錢;'); 讀取時