1.鼠標移動上去,圖片變亮,移開又變成灰色。改變的是透明度。


          <style>
          .p1{filter:Alpha(Opacity=20)}
          .p2{filter:Alpha(Opacity=100)}
          </style>

          <a href=http://www.pealand.com/ target=_blank><img src=images/game01.gif border=0 class=p1 onmouseover="this.className='p2'" onmouseout="this.className='p1'"></a>
          <a href=http://www.pealand.com/sc target=_blank><img src=images/game04.gif border=0 class=p1 onmouseover="this.className='p2'" onmouseout="this.className='p1'"></a>
          <a href=http://bzb.gbq.cn target=_blank><img src=images/game06.gif border=0 class=p1 onmouseover="this.className='p2'" onmouseout="this.className='p1'"></a>
          <a href=http://www.pealand.com/myroom/edit.htm target=_blank><img src=images/game02.gif border=0 class=p1 onmouseover="this.className='p2'" onmouseout="this.className='p1'"></a>

          2.怎樣在網頁中播放mp3格式音樂
          <html>
          <title></title>
          <body>
          <embed src="</body>
          </html>

          詳細說明:

          <embed
          src="xx.mp3" 音樂文件
          loop=false 是否重復播放
          autostart=true 是否自動開始
          name=bgss 為了控制而設定的名字
          width="0" height="0" 寬、高
          >

          3.滾動現實公告

          <table width="800" border="0" cellspacing="0" cellpadding="0">
          <tbody>
          <tr style="text-align: center;">
          <td height="0"> <hr noshade> <p>
          <marquee>
          <xmp> 事件文字滾動 ——公告</xmp>
          </marquee>
          </p>
          <hr noshade></td>
          </tr>
          </tbody>
          </table>

          4.以圖片作為按鈕

          <form method="post" action="test.html">
          <input type="text" name="textfield">
          <input type="text" name="textfield2">
          <input type="image" border="0" name="imageField" src="../img/submit.jpg" width="71" height="32" onclick="submit()">
          </form>

          5.表格中單元格之間分隔線的隱藏方法

          其實上面的三個表格都有三行三列,隱藏分隔線的訣竅在于rules,察看這三個表格的源代碼,我們可以看到<TABLE>標簽中都有rules。 它有三個參數(cols,rows,none),當rules=cols時,表格會隱藏縱向的分隔線,這樣我們就只能看到表格的行;當rules=rows時,則 隱藏了橫向的分隔線,這樣我們只能看到表格的列;而當rules=none時,縱向分隔線和橫向分隔線將全部隱藏。


          6.表格邊框的隱藏
          表格邊框的顯示與隱藏,是可以用frame參數來控制的。請注意它只控制表格的邊框圖,而不影晌單元格。
          只顯示上邊框 <table frame=above>
          只顯示下邊框 <table frame=below>
          只顯示左、右邊框 <table frame=vsides>
          只顯示上、下邊框 <table frame=hsides>
          只顯示左邊框 <table frame=lhs>
          只顯示右邊框 <table frame=rhs>
          不顯示任何邊框 <table frame=void>


          7.刷新的不同狀態

          非模態刷新父頁面:window.opener.location.reload();
          模態刷新父頁面:window.dialogArguments.location.reload();??
          window.location.assign('chklogin.asp');
          window.location.reload('chklogin.asp');
          以后用前者進行刷新吧。后者似乎對FF 不怎么兼容。

          8.文字過長,縮略顯示為...

          <DIV STYLE="width: 120px; border: 1px solid blue;
          overflow: hidden; text-overflow:ellipsis">
          <NOBR title="就是比如有一行文字,很長,表格內一行顯示不下.">就是比如有一行文字,很長,表格內一行顯示不下.</NOBR>
          </DIV>


          9.加入收藏夾通用代碼

          <script type="text/javascript">
          function addBookmark(title,url)
          {
          if (window.sidebar)
          {
          window.sidebar.addPanel(title, url,"");
          } else if( document.all )
          {
          window.external.AddFavorite( url, title);
          } else if( window.opera && window.print )
          {
          return true;
          }
          }
          </script>
          頁面使用:<a href=javascript:addBookmark('天極網網頁陶吧','http://homepage.yesky.com/')> 添加到收藏</a>

          10.幾種彈出窗口

          用戶輸入:var msg=prompt("請輸入密碼:");if(msg == "PKU")? 彈出輸入框。
          用戶確定:var IsOk = confirm('ok');
          open為打開一個窗口。


          11.動態改變 下拉列表的值。

          ?document.formname.elements[第幾個元素].text = "test";
          ?eg:
          ?document.test9_1.elements[0].options[0].text="昆明市";
          ?當然也可以用,之所以寫出來是因為很多時候,我總是習慣用value,而忽略了text屬性:
          ?document.getElementById('select').options[0].text="昆明市";
          ?
          12.動態插入表格內容:

          document.getElementById('saleAndLost').rows[1].cells
          x[1].innerHTML="test";
          ?
          13.播放器代碼

          (1)media player代碼:
          <DIV>
          <OBJECT id=videowindow1 height=185 width=179 classid=CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6>
          <PARAM NAME="URL" VALUE="
          <PARAM NAME="playCount" VALUE="infinite">
          <PARAM NAME="autoStart" VALUE="1">
          <PARAM NAME="volume" VALUE="50">
          <PARAM NAME="uiMode" VALUE="full">
          <PARAM NAME="stretchToFit" VALUE="1">
          </OBJECT>
          </DIV>
          ?
          其中
          改變這個地址也就改變了你的歌曲


          (2)WMP播放器
          <embed src="影音文件地址" width="播放器寬" height="播放器高" autostart="true" loop="true" align="middle" volume="200" type="audio/x-pn-realaudio-plugin" exts="ra,ram" Init fn="load-types" mime-types="mime.types" ALT="(Random)"></embed>

          (3)Flash播放器
          <embed src="Flash地址" pluginspage="


          (4)RealPlayer播放器
          <object classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" width="480" height="360">
          <param name="src" value="dfA.rmvb" />
          <param name="controls" value="ImageWindow" />
          <param name="console" value="_master" />
          </object><br />
          <object classid="CLSID:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA" width="480" height="32">
          <param name="src" value="dfA.rmvb" />
          <param name="controls" value="controlpanel" />
          <param name="AUTOSTART" value="1">
          <param name="console" value="_18c03c83e52df1f1285b0ac2d1ea7911" />
          </object>

          14.window.open參數詳解
          (1). 使用舉例:
          ?? <SCRIPT?? LANGUAGE="javascript">????
          ? <!--????
          ? window.open?? ('page.html',?? 'newwindow',?? 'height=100,?? width=400,?? top=0,?? left=0,?? toolbar=no,?? menubar=no,?? scrollbars=no,resizable=no,location=no,?? status=no')????
          ? //寫成一行????
          ? -->????
          ? </SCRIPT>????
          (2). 參數詳細描述
          ? 'page.html'?? 彈出窗口的文件名;????
          ? 'newwindow'?? 彈出窗口的名字(不是文件名),非必須,可用空''代替;????
          ? height=100?? 窗口高度;????
          ? width=400?? 窗口寬度;????
          ? top=0?? 窗口距離屏幕上方的象素值;????
          ? left=0?? 窗口距離屏幕左側的象素值;????
          ? toolbar=no?? 是否顯示工具欄,yes為顯示;????
          ? menubar,scrollbars?? 表示菜單欄和滾動欄。????
          ? resizable=no?? 是否允許改變窗口大小,yes為允許;????
          ? location=no?? 是否顯示地址欄,yes為允許;????
          ? status=no?? 是否顯示狀態欄內的信息(通常是文件已經打開),yes為允許;

          15.構造可編輯的select下拉框

          <input type=text name=re_name style="width:80px;height:21px;font-size:10pt;"><span style="width:18px;border:0px solid red;">
          <select name="r00" style="margin-left:-80px;width:98px;height:21px;background-color:#FFEEEE;" onChange="document.all.re_name.value=this.value;">
          ?<option value="1024">1024</option>
          ?<option value="10240">10240</option>
          ?<option value="102400">102400</option>
          </select>
          </span>

          16. js 動態改寫iframe 內容
          <iframe src="about:blank" width="200" height="200" id="view" name="view" onload="f(this);" onfocus="g(this);"></iframe>

          <script>
          function f(aa)
          {
          aa.contentWindow.document.body.innerHTML = 'fff';
          }

          function g(aa)
          {
          aa.contentWindow.document.body.innerHTML = 'ggg';
          }
          </script>?



          FeedBack:
          # re: 常見網頁技巧(1)
          2007-06-10 17:37 | watson hua
          第一個可以使用偽類實現  回復  更多評論
            
          # re: 常見網頁技巧[未登錄]
          2007-08-15 20:27 | -274°C
          網頁中所有鏈接去除下劃線:
          <style type="text/css">
          <!--
          a:link {
          text-decoration: none;
          }
          a:visited {
          text-decoration: none;
          }
          a:hover {
          text-decoration: none;
          }
          a:active {
          text-decoration: none;
          }
          -->
          </style>  回復  更多評論
            
          # re: 常見網頁技巧
          2007-12-22 02:20 | ssss
          abc  回復  更多評論
            
          # re: 常見網頁技巧[未登錄]
          2008-10-24 09:30 | -274°C
          不久看到的一種方法(滿天過海),滿聰明的。

          <input name="file2" type="file" style="display:none;">
          <input id='url' class="input01" name="inquiry_img_nm" style="width:150px;height:20px">
          <button style="position:relative;left:2px;border:1px solid;width:76px;height:20px" onclick="file2.click();url.value=file2.value;url.select();">UploadFile...</button>  回復  更多評論
            
          # re: 常見網頁技巧[未登錄]
          2008-10-24 11:23 | -274°C
          不希望網頁提示腳本有錯的處理方式:

          <html>
          <head>
          <script type="text/javascript">
          onerror = function(msg,url,l){ return true;}
          function message()
          {
          adddlert("Welcome guest!");
          }
          </script>
          </head>
          <body>
          <input type="button" value="View message" onclick="message()" />
          </body>
          </html>  回復  更多評論
            
          # re: 常見網頁技巧
          2008-10-28 01:03 | -274°C
          關于onsubmit()的觸發時機:

          只是在input type=submit 觸發,用image提交或者 button提交的時候均不觸發。  回復  更多評論
            
          # re: 常見網頁技巧
          2009-01-21 11:53 | JAVA-HE
          在url地址前面加個圖標

          ①制作或找一個16×16像素的圖標(ico文件)

          ②保存文件名為 favicon.ico

          ③上傳到你網站的根目錄

          那么有了Favicon.ico該怎么使用呢?很簡單,你只需要把Favicon.ico上傳到網站的根目錄,這樣整個站點的URL前面都會出現這個圖標,是不是很簡單?

          如果您需要將Favicon.ico放到其他目錄下,或者希望讓不同的網頁顯示不同的Favicon,那就需要在網頁Html文件中做設定了,具體設置也很簡單,在Html源代碼中的<head>部分加入如下的代碼:

          <link rel="icon" href="/slyar/favicon.ico" type="image/x-icon">
          <link rel="shortcut icon" href="/slyar/favicon.ico" type="image/x-icon">
            回復  更多評論
            
          # re: 常見網頁技巧
          2009-07-06 00:14 | hcm
          iframe 透明:

          <iframe src="./ads_top_tian.html" allowtransparency="true" style="background-color=transparent" title="test" frameborder="0" width="470" height="308" scrolling="no"></iframe>  回復  更多評論
            
          # re: 常見網頁技巧
          2010-10-12 16:12 | -274°C
          在非IE瀏覽器,同一元素同一事件類型的處理函數是先進先出的。只有IE下,是先進后出。
          jQuery實現了自己的一套隊列機制,用jQuery注冊的事件,在IE下也是先進先出的。  回復  更多評論
            
          # re: 常見網頁技巧
          2010-10-12 16:14 | -274°C
          阻止鏈接a的默認事件時,用preventDefault足矣,stopEvent會對之后的擴展帶來麻煩。  回復  更多評論
            
          # re: 常見網頁技巧
          2010-10-12 16:16 | -274°C
          IE里,setTimeout會改變執行環境,比如Event.getTarget(ev)放在里面將導致錯誤。—— event對象在變當然不能放里面  回復  更多評論
            
          # re: 常見網頁技巧
          2010-10-21 11:51 | 274
          居中:

          body{
          text-align:center;
          }
          div{
          width:900px;
          height:600px;
          border:5px solid red;
          margin:0px auto;
          text-align:left;
          }   回復  更多評論
            

          常用鏈接

          留言簿(21)

          隨筆分類(265)

          隨筆檔案(242)

          相冊

          JAVA網站

          關注的Blog

          搜索

          •  

          積分與排名

          • 積分 - 914107
          • 排名 - 40

          最新評論

          主站蜘蛛池模板: 会泽县| 望城县| 息烽县| 桃园市| 彝良县| 天祝| 崇州市| 高淳县| 隆子县| 晋中市| 晴隆县| 千阳县| 乳源| 祁门县| 当阳市| 眉山市| 保山市| 南投市| 玉门市| 阿图什市| 濉溪县| 桐乡市| 宁晋县| 库尔勒市| 镇雄县| 确山县| 华安县| 融水| 绿春县| 句容市| 肇州县| 武功县| 邵东县| 深泽县| 凭祥市| 阿克苏市| 金乡县| 攀枝花市| 商丘市| 广安市| 大姚县|