其他

自己前端開發中常用到的一些技巧及問題解決方案,會常更新,希望對前端路上的朋友有協助.1.文章標題列表中日期居右顯示的方法:<p><span>2010-10-10</span>@Mr.Think這是文章標題</p>然後定義span右浮動:p

最近寫了兩個管理背景前端頁面,其中有一個管理後台,左側菜單導航和右側內容頁是兩個iframe,需求是,點擊上面的主導航時,左側iframe和右側iframe調用不同的連結.個人推薦用jQuery實現,代碼簡潔,擴充性強.jQuery部分:function gotourl(url_a, url_b){    $('#ifr_a').get(0).src = url_a;    $('#ifr_b').get(0).src = url_b;}html調用:<a

使用jQuery很長時間了,但一直沒有深入的研究過. 下午正好有空,看了鋒利的jQuery第1和第2章,頃刻間為之所迷.之前也曾通過jQuery手冊瞭解過一些jQuery的知識,但從沒系統的看過它的核心.看完鋒利的jQuery前兩章,jQuery簡直太美了.簡單,易懂,易用,還有那無所不能的$(雖然有點誇大,哈哈). The write less,do more

計時器setTimeout()與setInterval()是原生JS很重要且用處很多的兩個方法, 但很多人一直誤以為是相同的功能: 間隔時間重複執行傳入的控制代碼函數. 但實際上, 並非如此, 既然JS給出了兩個不同的命名, 肯定有其迥異之處.先來看看兩者JS手冊及英文詞典上的解釋:JS手冊»setTimeout() : 用於在指定的毫秒數後調用函數或計算運算式;英文釋義»timeout() : 逾時；暫時休息；工間休息;JS手冊»setInterval() :

分享一個簡易的動畫效果類,思路源於JavaScript

最近在為項目寫登入註冊系列頁面, 表單驗證無疑是不可缺少的部分, 在這個jQ外掛程式滿天飛的web年代, 表單驗證倒也不是難事. 但再好的外掛程式, 也並不能做到十全十美, 比如這次用到的我先前介紹過的Vanadium表單驗證外掛程式, 因為是E文中不存在佔2個字元的字, 所以, 區分中英文字元就得自己擴充. 本文就將介紹兩種區分中英文字元的方法: 利用正則和charCodeAt方法區分中英文字元.點此查看DEMO正則無疑是最強大的判斷各種條件的方法, 最近也在研習它, 雖然枯燥, 但仍有樂趣.

實際應用中, 擷取元素樣式在實際應用中一定常用到, 若是純粹html中, 直接elem.style.attr就可擷取, 但更多的時候我們是要從Css中擷取元素的最終樣式屬性.所以, 我們得利用IE的currentStyle和W3C的getPropertyValue擷取.elem.style.attr擷取樣式的方法就不說了. 先來看currentStyle方法, 此對象ie專屬, 代表了在全域樣式表、內嵌樣式和 HTML 標籤屬性中指定的對象格式和樣式. IE下通過它,

PR值, 全稱為PageRank(網頁層級), 取自Google的創始人Larry Page. 它是Google排名運演算法則(排名公式)的一部分, 是Google用於標識網頁的等級/重要性的一種方法. 一直以來, 它是Google用來衡量一個網站好壞的唯一標準.然, 自09年10月中旬Google員工Susan Moskwa在Google網站管理員協助論壇中確認了pr值取消這一訊息起, PR是否真的會退出曆史舞台就開始在圈內鬧的沸沸揚揚. 而我, 也是非常關注這一動態CN草根站長中的一員.

日常項目中常用到的,用jQuery和原生JS分別寫了一個. 兩種寫法均實現了結構/表現/行為的完全分離.當然,稍作修改,可以在同一個頁面中應用於多個選項卡.關于思路,和常規選項卡思路一樣.點擊選項菜單,反白,並顯示對應的選項.本文執行個體中主要是通過判斷點擊菜單在菜單列表中的索引位置來顯示或隱藏選項區.原生js還有很多種實現方法(藍色理想中搜尋),為了與jQ版思路保持一致,本文執行個體用的是迴圈判斷. 詳見注釋.另有幾點說明:1.

最近在讀阿當的《Web前端開發修鍊之道》, 其中有不少東西值得前端路上的朋友學習. 結合自己日常編碼的一些經驗, 我將陸陸續續將一些從書中學到的以及自己總結的一些前端方面的技巧分享給大家.Html語義化, 似乎是一個老生常談的問題. Google一下,也有大把關於語義化的文章. 為什麼要語義化標籤? 我是這樣認為的:Html的每個標籤都有它特定的意義,而語義化,就是讓我們在適當的位置用適當的標籤, 以更好的讓人和機器(機器可理解為瀏覽器可理解為搜尋引擎)都一目瞭然. 如果我的解釋不夠明了,

奇或偶數行高亮顯示及滑鼠莫過高亮顯示,一個經常用到的效果,也能Google到大把的這種效果JS,但好像還沒有一個封裝成類直接用的.想象自己當初Google這個類時,還真沒少折騰時間.花了點時間,封裝成了一個類(附帶一個添加樣式的類),適合初學者,直接調用函數即可,無需改代碼.核心JavaScript代碼:點此查看DEMO//@Mr.Think---添加樣式的類function addClass(elem,value){    if(!elem.className){      

Mr.Think是一個喜歡簡潔的人,喜歡如詩一樣的代碼.不喜歡.NET的代碼,就是因為經常看到同事用VS後產生出來的一段段冗長的代碼.在我的思維中,JavaScrip是一種很飄逸的語言,所以,寫給TA的代碼,也一定要做到飄逸,呵.比如用_$(id)代替document.getElementById(id).個人比較推薦用prototype中對document.getElementById的定義:function $(){  var elements = new Array();  for

上午在項目中遇到的一個問題, 折騰了半小時才把思路理順. 需求是, 同一個頁面, 有多組(不固定), 每組區塊數量不一定一樣的小區塊. 要求每次只展開一個區塊. 實現原理其實很簡單, 點擊導航, 若它的區塊為隱藏, 則展開它, 同時, 隱藏掉同組其他區塊; 若它的區塊為展開, 則隱藏它, 同時, 展開同組其他區塊中的一個. 一開始以為僅僅簡單的兩個遍曆就能搞定. 但事實並非如此. 冷靜思考了下, 通過點擊的元素取到當前組的相關元素, 再單獨處理當前組才合理. 順著這個思路, 功能終於實現了,

一個隨機排列元素的方法, 其實之前是在攝影頁面寫的一個小效果.查看示範: 點此查看DEMO實現方法利用Math.random()產生隨機數, 再通過sort()進行隨機排列.核心代碼function randomFun(){    var h5=document.getElementsByTagName('h5')[0]    var spanItem=document.getElementsByTagName('span');    var random=function(){return

為了學習Linux系統,花了兩個晚上的時間把電腦徹底清空重新規划了一次, 讓Ubuntu與Win7和平共存.裝系統是小兒科,但煩的是大大小小一大堆的軟體.ghost很重要.而對我,用的最多的是Zend Studio加Aptana的完美結合.我想,無論對於前端人員還是PHP開發人員,Zend Studio加Aptana絕對堪稱經典.可惜中文資料太少,讓很多人在安裝和使用時繞了不少彎路,在此分享一下,安裝過程中幾個實用的技巧.Zend Studio的下載安裝就不詳敘了,自己Google下.本文以7.

可擴充的簡易點擊展開/關閉效果,分別用原生JavaScript和jQuery實現.使用方法及相關解釋,請參見源碼.另,授人以魚,不如授人以漁.我寫的只是一個原型,提供一個思路一種方法.注釋中我也註明了,如果你想要酷炫的效果,你可以根據自己的實際需求擴充.查看示範: 點此查看DEMO原生JS版本:window.onload=function(){    var divs=document.getElementsByTagName('div');//找到所有div元素    for(var i=0;

時常遇到朋友問我前端學習該如何學習, 看哪些書藉. 自己也希望將自己的一些學習心得與經驗傳教於初學者. 抱著對初學者負責的態度, 如何學習前端, 我還需要在心成有個成熟的底稿後再來寫, 本文先以自己學習過程中看過的書為基礎, 總結一下前端學習各個階段書籍的選擇.HTML與CSS階段書藉選擇對初學都來說,這一階段應該是XHTML與CSS2的學習. 學習前期, 建議至多看兩本書: 《CSS權威指南》和《CSS那些事兒》, 有一定CSS基礎後, 可以看《精通CSS：進階Web標準解決方案》.

淡入淡出效果,在日常項目中經常用到,可惜原生JS沒有類似的方法,而有時小的頁面並不值得引入一個jQuery庫,所以就自己寫了一個,已封裝, 有用得著的朋友, 可以直接使用. 代碼中另附有一個設定元素透明度的方法, 是按IE規則(0~100)設定, 若改成標準設定方法(0.00~1.00), 下面使用時請考慮浮點精確表達差值.參數說明:fadeIn()與fadeOut()均有三個參數,第一個是事件, 必填; 第二個是淡入淡出速度, 正整數, 大小自己權衡, 選擇性參數; 第三個,

近期在寫一個部落格管理背景前端,涉及在同一頁面兩種高亮顯示當前菜單的需求.記得當年寫靜態頁時,為了實現高亮都是在每個頁面加不同的樣式,呵.高亮顯示我覺得對於web前端來說,是比較常用到的效果,正好此次又要用到,特地整理出我所寫的兩種高亮類.其實思路很簡單,第一種方法是通過遍曆連結組的href值,通過indexOf判斷href值是否被包含在瀏覽器當前url值中.此方法有一定局限,比如對於iframe內的菜單是不能這樣判斷的;

用table布局,相信大家都知道這是前端很詬病的事.但從HTML標籤角度來看table標籤,它的功能強大也是毋庸置疑的, 不然, 它也不會曾主導網站配置模式數年(甚至於現在仍有N多整站用table布局的網站). 但CSS+XHTML的興起,使很多人開始妖魔化table這一標籤,甚至以頁面中是否有table來評判頁面品質,這是不對的. table也有它存在的作用,很多頁面功能(比如資料表格類,表單對齊等)用table實現遠比用div實現起來簡單明了.當然,本文不是為table平反的,