其他

　　上一周我說到，我要開始做一個仿案頭系統的CMS。現在，一周過去了，來做個小小的總結吧，順便把上一周片尾留的小問題解答下。案頭　　關於介面，思前想後，還是模仿115的了，說是模仿，其實幾乎是照搬。因為我看了下HTML和CSS，沒有什麼太大的技術含量，製作起來也不會遇到什麼困難，乾脆捨棄這一步，進入後面的話題。　　上周我留下了一個問題，就是案頭那一個個捷徑，為什麼不能直接寫在頁面裡，而要通過js來載入。其實，並非一定要通過js載入產生，但是即便寫在頁面裡，也還是通過js來定位，對，就是定位。試想

　　首先，感謝你為我的這篇文章點了推薦，雖然你可能沒有點，但是我已經“好心”的幫你點了。不信？那你先看下文章右下角的推薦數，然後重新整理下頁面看看。　　下面我來說下實現原理，其實沒什麼技術含量，懂點js的人都能進行操作。　　我先用firebug查看了頁面上推薦按鈕的DOM，發現其實是個點擊事件：　　是一個叫 DiggIt() 的方法，分別傳入了3個參數，看參數命名應該分別是文章ID、部落格ID和一個寫死的1。這下就簡單了，是不是我直接在頁面底部寫句一模一樣的方法，就能實現了呢？　　於是我到後台“

　　終於可以拿出來給大家測試了，測試地址http://saw.caifutang.com/EonerCMS，東西就不用再介紹了吧，之前做過一個簡單的介紹視頻，這次再拿出來曬下，就當作作品介紹吧。　　開發記錄：　　關於CMS後台展示/操作方式的個人拙見——最早的一個想法，當時僅僅有這個想法，但未開動　　EonerCMS——做一個仿案頭系統的CMS（一）——開篇，因為我是個行動派，所以馬上就開動了，後來想了想，應該會遇到很多問題，於是就打算把問題都記錄下來。於是第一篇博文算是引言了　　EonerCM

　　HTML5增加了更多語義化的標籤，如header，footer，nav……讓我們在頁面編寫的時候，不需要再用下面這種方法去布局了：<div class="header">這是頭部</div><div class="content">這是中間內容區</div><div

　　工資真的是和大姨媽一模一樣啊，一個月來一次，一周左右就走了。10號發的工資，今天去買了個移動硬碟，加了跟2G記憶體，還了朋友500，然後就剩下飯錢了，這個月又光了，有木有！！！！！　　不過開心的事是有1TB移動硬碟了，本本記憶體也4G了>.<欣然回家開啟電腦，右鍵我的電腦看屬性，然後就囧住了：　　這才想起來自己的系統是32位的，除非換成64位才能享受4G的快感，但是由於電腦裡軟體過多，程式猿都懂的，重裝系統對我們來說傷不起啊，資料庫要備份，項目要備份，軟體要備份，神馬都要備份，這

　　下面我要用到的外掛程式是我自己寫的，關於外掛程式地址是：jquery.HooRay——自己做的一個jquery常用工具外掛程式。關於分享外掛程式的製作流程我也寫了篇文章，有興趣的可以看下：自己寫的一個分享按鈕的外掛程式（可擴充，內附開發製作流程）　　閑話不多說，進入正題吧，大家可以看下文章最後是不是有一排分享的按鈕，那個就是最終的效果了，當然不止那一種效果，一共有以下幾種效果，分別是：　　完整的代碼就是這樣<link rel="stylesheet" href="http://saw.

　　這次的功能不用我介紹，是的，就是要做那個win7下視窗超級預覽的功能。為了方便，我就做個demo來示範，就不用圖裡的例子來做講解了。　　首先，我們必須知道transform，它是CSS3中的新增屬性，這次我們要用到的就是：transform:scale()。這裡要提一點注意，scale()是不影響layout的，也就是scale()僅僅是視覺上效果不一樣，實際的樣式都是不變的，而且scale()的縮放是以中心縮放的，這就會造成一個浮動元素縮放後top、right、bottom、left在視覺

　　WebQQ於昨晚更新，並且把名字都改了，現改名叫Q+

　　首先看下效果，以下兩張圖分別使用直接盜鏈和破解盜鏈，可以右鍵查看圖片URL，是同一張圖片。直接盜鏈破解盜鏈　　實現代碼：function showImg( url ) { var frameid = 'frameimg' + Math.random(); window.img = '<img id="img" src=\''+url+'?'+Math.random()+'\' /><script>window.onload =

　　一直以來，寫php都是用Dreamweaver，有時候真是痛苦啊，出現一個bug，想看一些元素的值，必須用echo輸出來才知道，現在瞭解到一個斷點調試利器，php終於也能像java、.NET那樣斷點調試，這就是——ZendDebugger　　東西不是新貨，所以介紹就不做介紹了，下面主要是配置流程。　　首先，下載ZendDebugger，下載連結：http://downloads.zend.com/pdt/server-debugger/，因為我是win系統，所以就找.zip結尾的就行了，我下

　　經常會遇到這樣的情況，當頁面展示內容過長時，想點導航切換欄目，就得把捲軸拉回到頂上，這樣操作總不太人性化，能不能讓導航超出顯示範圍外時自動貼在螢幕最頂上呢？答案肯定是能的。如果不太明白，把捲軸拉到下面點，看下我部落格是效果就明白了。　　其實實現起來並不難，我們先把實現流程大致想一下，首先，如果導航在顯示範圍內，就不用做修改。當導航超出顯示範圍，也就是導航距離螢幕頂部的距離小於0的時候，我們要讓它浮動在螢幕頂上，然後大於0的時候，進行一個複原操作，原理就是這麼簡單，大致看下吧$().ready

　　拖動實現的思路已經更新，為防止大家步入誤區，本文建議不用閱讀太細，實現思路請參考：http://www.cnblogs.com/hooray/archive/2012/03/23/2414410.html表徵圖拖動排序　　最近加了一個人，給我提了不少意見，也幫了測了一些bug，這次要說的更新就是表徵圖拖動排序的功能。開始我以為實現會很難，當動手開始做的時候，發現也不過如此。下面我就一點點把我的思路告訴大家。　　首先，表徵圖拖動和視窗拖動的實現代碼是幾乎一樣的，如果你對這個不清楚，可以看下我之

事件冒泡　　事件冒泡是個很常見的問題，不過我之前沒聽說過，所以這裡只是做個筆記，如果瞭解事件冒泡，並清楚如何處理的，可以直接跳過這篇文章。下面我們看下這面這demo，點擊紅色地區，會彈出1，點擊灰色，會彈出2。alert(2);alert(1);$("#div1").click(function(){alert(1);});$("#div2").click(function(){alert(2);});　　處理辦法其實很簡單，有兩種，一種就是“e.stopPropagation();”，另外一種

　　昨天晚上經曆了這麼一個事件，我通過部落格園背景自訂JS類比出自動關注、自動推薦的功能，本意是為了能引起官方注意，儘早修複。卻沒想到部落格園處理的方式是，把文章移除首頁，推薦清零，然後去掉我自訂JS的功能，就差刪我文章，封我帳號了。　　以下是我在部落格園小組以及通過郵件發了2個告示，至今沒有回複，而我看到小組裡其他一些問題，都是在12小時內就馬上回複的，我就不相信管理沒看到我的文章。　　當然也有人質疑我的做法，不應該公開宣布。如果私下發郵件，發站內信能解決的話，這問題早就不複存在了，又不是我第

判斷瀏覽器是否縮放　　這是一個困擾我一周的問題了，不過現在終於在@Mr.L的協助下解決了，下面先描述下問題吧。大家在瀏覽QQ空間的時候，通過瀏覽器，或者按住ctrl+滑鼠滾輪進行頁面縮放，頁面上會有個很友好的提示，如：　　開始，我以為是通過判斷視窗寬高，但發現縮放後的寬高和原先的寬高是一樣的。失敗。　　然後，通過別人提供的資料《How to detect page zoom level in all modern

　　首先說明，上面圖片和文章無關，只是我隨便弄的一張配圖，因為我剛才在想4個DIV能不能擺成那種造型，當然最終是以失敗告終。　　恢複正題，這次更新變動不大，增加了一個效果和一個方法，也發現了一個bug，但還沒有解決。　　一、表徵圖視窗移動動畫　　這個不用介紹太多，自己試下就知道了，示範地址：http://saw.caifutang.com/eonercms　　當我們改變瀏覽器大小的時候，表徵圖以及開啟的視窗會以動畫的效果移動。　　二、重新整理案頭　　這個功能是考慮到以後做CMS裡欄目模組使用權限

智能修改視窗的位置　　在測試的時候，我發現調整瀏覽器尺寸後，原先靠近瀏覽器邊緣的視窗就直接被隱藏掉了，如：　　出現這問題的原因也很簡單，因為視窗的top、left的值是寫死的，當瀏覽器的寬高小於視窗top、left時，必然會被隱藏掉。解決辦法就是在調整瀏覽器尺寸的同時，把視窗的top、left也一起修改，但是具體要修改成多少呢？　　經過自己的考慮和他人的指點，最終的解決辦法就是按比例修改，也就是按當時視窗離左/右、上/下的距離與整個視窗大小的比例進行縮放，說的可能有點迷糊，不如看下修改公式吧：　

　　轉眼似乎半個多月過去了，最近忙了點其他的事，所以這個CMS做的進度也慢了，不過昨天和今天稍微加了點班，把最大的一塊製作OK了，也就是下面我要說的——視窗　　先看下視窗大致構成圖吧：　　視窗很簡單，頂部的標題區、中間的展示地區和底部的功能區域。首先，視窗肯定是通過表徵圖點擊後才產生的，也就是視窗不是事先載入並隱藏好，是點擊某個表徵圖後再通過jquery寫入到頁面裡來，那我們要做的就是給表徵圖綁定一個建立視窗的事件，我們看下代碼：//建立表單Core.create = function(obj)

　　因為我們無法通過任何方法擷取整個頁面的大小和當前載入了多少，所以想製作一個載入進度條的唯一辦法就是類比。那要怎麼類比呢？　　我們知道，頁面是從上往下執行的，也就是說我們可以大致估算出在頁面的某個位置載入了多少，而後用jq類比出一個進度條來顯示。　　首先我們先畫一個進度條的樣子，也就是圖中的樣子，這個不用過多說明，自己看代碼　　CSS.loading{position:relative;top:0;left:0}.tip1{float:left;background:#A70000;color

　　廢話不多說，繼上次遺留的問題——記憶體流失。　　趁周末，查了好多資料，也問了好多JS高手，大致是這麼個情況。因為我每開啟一個視窗，就綁定了一個永久性的dom元素，而dom元素的回收是靠計數器，計數器是會累加的，如果沒有清零，即便刪掉了節點，其實還是駐留在記憶體中。　　既然大致明白了原理，處理起來就相對比較簡單了，就一句話，首先先看下原先的關閉視窗的代碼//關閉$('.task-window li[window="'+obj.attr('window')+'"]').remove();obj.