中山php|最優(yōu)網(wǎng)絡(luò) ：中山做網(wǎng)站 中山php建站
最優(yōu)良人
Category Page for: 網(wǎng)站前端
asyncbox異步彈出窗口，jq彈出層插件，可異步加載頁面
2011/08/25 at 12:18 » Comments (20)
AsyncBox（異步盒子）是一款基于 jQuery 的彈窗插件。能夠?qū)崿F(xiàn)網(wǎng)站的整體風(fēng)格效果，給用戶一個新的視覺享受。主要模擬常用的 alert、confirm、prompt、open 和擴(kuò)展了一些對話框。它通過回調(diào)函數(shù)觸發(fā)事件動作并執(zhí)行，使操作區(qū)域更加明了、統(tǒng)一。而且能夠在主流瀏覽器中靈活運(yùn)用。 介紹及下載地址 http://www.nnhuashi.com/asyncbox/index.html 實(shí)例： $('#select-furns').click(function() { asyncbox.open({ id: 'select-form', ...more »解決jquery和prototype沖突，jquery和prototype共存的方法
2011/08/25 at 11:58 » Comments (251)
今天遇到一個項目的修改，由于該項目之前是使用prototype框架，而我拿手的是使用jquery框架，但是又不想全部重寫原來的頁面效果，所以在頁面引入了jquery文件，但是發(fā)現(xiàn)原來的js效果消失了，這是因?yàn)樗麄児餐褂昧?這個對象，造成了重寫覆蓋，解決方法是重定義jquery的這個對象 首先在頁面最開頭引入jquery文件，一定要在prototype文件引入之前，然后緊接著重寫$ <script type="text/javascript" src="data/jquery.min.js"></script> <script type="text/javascript"> var jQuery=$; </script> 然后在后面運(yùn)用jquery時把原來使用$的地方全部換成jQuery就可以了 more »div li元素不限定寬度，如何浮在中間
2011/08/18 at 17:47 » Comments (498)
div的橫向居中我們都知道而已用margin:0 auto;實(shí)現(xiàn)，但是在不指定寬度的情況下這語句是沒有意義的，div為塊級元素，在內(nèi)層DIV未指定寬度的情況下不能通過margin:0 auto來實(shí)現(xiàn)居中，將其轉(zhuǎn)換為內(nèi)聯(lián)元素（display:inline）后在外層DIV加text-align:center才能居中 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>無標(biāo)題文檔</title> </head> <body> <div style="width:800px;height:300px;text-align:center;margin:0 auto;background:#efefef;"><div style="background:#ff33cc;display:inline;">sdaasddsa</div></div> </body> </html> more »按鈕變成失效狀態(tài)，input框變成只讀模式以及CSS一些頁面控制
2011/08/18 at 14:42 » Comments (200)
以下代碼可以使按鈕變成失效狀態(tài) <input id="select-layout" type="button" value="布置圖管理" name="select-layout" disabled="disabled"> 以下代碼可以使input框變成只讀且禁用模式 <input name="demo" type="text" disabled value="value" readonly="true" /> CSS控制字?jǐn)?shù)多，隱藏多余字 text-overflow:ellipsis;word-break:keep-all;overflow:hidden; white-space:nowrap; 顯示豎的滾動條 overflow-y:auto;height:220px; //表格不被撐開，換行 style="word-break:break-all" 控制input或者textarea背景透明的樣式 background-color: transparent; 實(shí)現(xiàn)細(xì)邊的表格 <table width=500 border="0" align="center" cellpadding="5" cellspacing="1" bgcolor="#add3ef"> <tr bgcolor="#eff3ff"> <td>標(biāo)題：用戶：</td> </tr> <tr bgColor="#ffffff"> <td>內(nèi)容：</td> </tr> </table> 或者簡單通過這個屬性控制 style="border-collapse:collapse" more »HTML表單里面使用fieldset，legend標(biāo)簽，實(shí)現(xiàn)標(biāo)題浮在邊線上的效果
2011/08/15 at 09:58 » Comments (293)
經(jīng)?？吹揭恍┍韱螘幸环N相同的特殊效果，就是表單說明文字會浮在邊線上，可以用css控制實(shí)現(xiàn)，但是其實(shí)html有一個fieldset標(biāo)簽來實(shí)現(xiàn)這效果 HTML <fieldset> 標(biāo)簽 定義和用法 fieldset 元素可將表單內(nèi)的相關(guān)元素分組。 <fieldset> 標(biāo)簽將表單內(nèi)容的一部分打包，生成一組相關(guān)表單的字段。 當(dāng)一組表單元素放到 <fieldset> 標(biāo)簽內(nèi)時，瀏覽器會以特殊方式來顯示它們，它們可能有特殊的邊界、3D 效果，或者甚至可創(chuàng)建一個子表單來處理這些元素。 <fieldset> 標(biāo)簽沒有必需的或唯一的屬性。 <legend> 標(biāo)簽為 fieldset 元素定義標(biāo)題。 實(shí)例 組合表單中的相關(guān)元素： <form> <fieldset> <legend>health information</legend> height: <input type="text" /> weight: <input type="text" /> </fieldset> </form> 實(shí)現(xiàn)效果如下 health informationheight: weight: 還可以用css控制邊線的樣式和legend的樣式。 <form> <fieldset> <legend>health information</legend> height: <input type="text" /> weight: <input type="text" /> </fieldset> </form> more »php正則匹配時常用到的模式修正符
2011/08/15 at 01:19 » Comments (267)
PHP簡單的模版引擎主要的原理是使用preg_replace對模板的內(nèi)容進(jìn)行替換，替換成可執(zhí)行的php語句然后寫入緩存文本，再include進(jìn)來執(zhí)行。 在使用preg_replace時常用到的模式修正符有： e：$replacement 的字符串將被當(dāng)作php語句執(zhí)行 U：禁止貪婪匹配 只跟蹤到最近的一個匹配符并結(jié)束， m：在匹配首內(nèi)容或者尾內(nèi)容時候采用多行識別匹配 s：模式中的圓點(diǎn)元字符（.）匹配所有的字符，包括換行 more »js離開當(dāng)前頁面時觸發(fā)的函數(shù)
2011/08/15 at 01:14 » Comments (51)
js離開當(dāng)前頁面時觸發(fā)的函數(shù)： window.onbeforeunload=fun() ; function fun(return 'msg';) ; 這樣子在瀏覽器在捕捉到頁面即將離開的時候就會彈出提示框，顯示msg的內(nèi)容，詢問你確定或者取消 目前三大主流瀏覽器中firefox和IE都支持onbeforeunload事件 另外還有一個相似的函數(shù)Onunload： Onunload，onbeforeunload都是在刷新或關(guān)閉時調(diào)用，可以在<script>腳本中通過window.onunload來指定或者在<body>里指定。區(qū)別在于onbeforeunload在onunload之前執(zhí)行，它還可以阻止onunload的執(zhí)行。 Onbeforeunload也是在頁面刷新或關(guān)閉時調(diào)用，Onbeforeunload是正要去服務(wù)器讀取新的頁面時調(diào)用，此時還沒開始讀取；而onunload則已經(jīng)從服務(wù)器上讀到了需要加載的新的頁面，在即將替換掉當(dāng)前頁面時調(diào)用。Onunload是無法阻止頁面的更新和關(guān)閉的。而 Onbeforeunload 可以做到。 1、onbeforeunload事件： 說明：目前三大主流瀏覽器中firefox和IE都支持onbeforeunload事件,opera尚未支持。 用法： ·object.onbeforeunload = handler ·<element onbeforeunload = "handler" … ></element> 描述： 事件觸發(fā)的時候彈出一個有確定和取消的對話框，確定則離開頁面，取消則繼續(xù)待在本頁。handler可以設(shè)一個返回值作為該對話框的顯示文本。 觸發(fā)于： ·關(guān)閉瀏覽器窗口 ·通過地址欄或收藏夾前往其他頁面的時候 ·點(diǎn)擊返回，前進(jìn)，刷新，主頁其中一個的時候 ·點(diǎn)擊 一個前往其他頁面的url連接的時候 ·調(diào)用以下任意一個事件的時候：click，document write，document open，document close，window close ，window navigate ，window NavigateAndFind,location replace,location reload,form submit. ·當(dāng)用window open打開一個頁面，并把本頁的window的名字傳給要打開的頁面的時候。 ·重新賦予location.href的值的時候。 ·通過input type="submit"按鈕提交一個具有指定action的表單的時候。 可以用在以下元素： ·BODY, FRAMESET, window 平臺支持： IE4+/Win, ...more »異步加載可視化編輯器 Xheditor
2011/08/15 at 01:02 » Comments (6)
如果像上一篇文章使用基于Jquery的可視化編輯器 Xheditor 那樣設(shè)置的話，訪問頁面時會加載70多k的jquery文件和50多k的xheditor文件，為了追求頁面默認(rèn)加載的性能提升，其實(shí)這些文件完全可以在編輯的時候異步加載的，下面是操作步驟： 1，需要用到一個異步加載js文件并執(zhí)行的函數(shù) function getJsFile(url, callBack){ var XH = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject('Msxml2.XMLHTTP'); XH.open('get',url,true); XH.onreadystatechange = function(){ if(XH.readyState == 4 && XH.status == 200){ if(window.execScript) window.execScript(XH.responseText); else eval.call(window, XH.responseText); eval(callBack); } ...more »使用基于Jquery的可視化編輯器 Xheditor
2011/08/15 at 01:00 » Comments (19)
使用方法 1. 下載xhEditor最新版本。 下載地址：http://code.google.com/p/xheditor/downloads/list 2. 解壓壓縮文件，將其中的xheditor.js以及xheditor_emot、xheditor_plugins和xheditor_skin三個文件夾上傳到網(wǎng)站相應(yīng)目錄 3. 在相應(yīng)html文件的</head>之前添加 <script type="text/javascript" src="http://static.xxx.com/js/jquery.js"></script> <script type="text/javascript" src="http://static.xxx.com/js/xheditor.js"></script> 4. 方法1：在textarea上添加屬性： class="xheditor {skin:'default'}"，前面主參數(shù)也可以是xheditor-mini和xheditor-simple，分別加載迷你和簡單工具欄，后面詳細(xì)參數(shù)可以省略 方法2：在您的頁面初始JS代碼里加上： $('#elm1').xheditor(); $('#elm1').xheditor()； 例如： $({ $('#elm1').xheditor()； }); 相應(yīng)的刪除編輯器的代碼為 $('#elm1').xheditor(false)； 重要說明：2種初始化方法只能選擇其中一種，不能混合使用，優(yōu)先級分別是：方法1>方法2，例如用了方法1，方法2就無法使用了 更多幫助信息，請查看在線幫助：http://code.google.com/p/xheditor/wiki/Help 或者參考demos文件夾中的演示頁面 建議使用wizard.html初始化代碼生成向?qū)砩蛇m合你的代碼。 more »異步加載 Xheditor 的時候遇到的瀏覽器兼容問題
2011/08/14 at 02:55 » Comments (20)
由于各個瀏覽器對js代碼的異步執(zhí)行函數(shù)的支持不一樣 window.execScript() 只支持IE瀏覽器 eval() 雖然支持各個瀏覽器，但是卻不能在全局執(zhí)行 解決的方法是利用javascript里面有一個改變上下文環(huán)境的關(guān)鍵字with . 把GetJsFile方法改成如下： function getJsFile(url, callBack){ var XH = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject('Msxml2.XMLHTTP'); XH.open('get',url,true); XH.onreadystatechange = function(){ if(XH.readyState == 4 && XH.status == 200){ with ( window )eval(XH.responseText); //if(window.execScript) window.execScript(XH.responseText); //else eval.call(window, XH.responseText); with ...more »返回菜單
