謮取ID document.activeElement.id | select | 手指指標 |

this select id ="st8523"
this id ="BT_1"
this id ="BT_2"
this id ="BT_3"
this id ="BT_4"

button style="cursor:pointer" 變更為手指指標

document.getElementById('st8523').selectedIndex=0 to 3 可改變select選擇 }
謮取ID document.activeElement.id;


select | input | onclick | width | style | font-size | tbody | cursor: pointer;| font-size: | 謮取ID document.activeElement.id | select | 手指指標 |

c8cc168 發表在 痞客邦 留言(0) 人氣()

blogger 樹狀標籤


1) 後台 → 打開範本文件 → 修改 HTML

2) 搜尋 <b:widget id='Label1' locked='false' title='標籤' type='Label'>

3) 標籤 要設定好才有顯示.
   首部 - 次部 - 三部
   例如 HTML-div-H1

4) 下三行 張 <h2><data:title/></h2> 改為

<h2><div id="treeLabel_toggle"><a href="http://wayne- fu.blogspot.com/2013/01/multi-tree-label-update.html" rel="nofollow" target="_blank"><img class="post-img" src="http://2.bp.blogspot.com/-nn8uU4LhVtM/T8cdzYQnUZI/AAAAAAAACos/JcGy8V05y84/s1600/info.png"/></a></div><data:title/></h2>

5) 向下搜尋程式

<b:if cond='data:display == &quot;list&quot;'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>

改為

  1. <div id="treeLabel_main" style="font-family: Arial;"><span id="treeLabel_host" class="item-control blog-admin"></span></div>
  2.  
  3. <style>
  4. #treeLabel_toggle {
  5.   float: right;
  6.   font-family: Arial;
  7. }
  8. #treeLabel_toggle a, #treeLabel_main a {
  9.   font-size: 10pt;
  10.   text-decoration: none;
  11. }
  12.  
  13. .treeLabel_catText a:link {
  14.   color: #0b5394; /* 請填入大分類的顏色, 如果要使用系統預設的超連結顏色, 可刪除此行 */
  15.   font-weight: bold;
  16. }
  17. .treeLabel_catText a:hover {
  18.   color: #b8b832;  /* 請填入滑鼠移過大分類要顯示的顏色, 如果要使用系統預設的超連結顏色, a:link 與 a:hover 的顏色都不要設定 */
  19. }
  20.  
  21. .treeLabel_category {  /* 這裡可設定大分類名稱區塊的 CSS */
  22.   font-size: 10pt;
  23.   margin-top: 4px;
  24. }
  25. .treeLabel_label {  /* 這裡可設定標籤名稱區塊的 CSS */
  26.   font-size: 10pt;
  27.   margin-top: 2px;  
  28. }
  29. </style>
  30.  
  31. <script>
  32. //<![CDATA[
  33. var treeLabel = {
  34.   category: ["電腦", "休閒", "閱讀"], // 雙引號內填入大分類名稱, 每個大分類用小寫逗號隔開, 最後一個大分類之後不可有逗號; 填入順序就是顯示的順序
  35.   showLevel: 2,  // 預設打開的標籤層數, 填入 1 為全部收起的狀態
  36.   showCategoryCount: "Y",  // 大分類若不顯示文章數, 請填入 "N"
  37.   openLogo: "▼",  // 如使用圖檔,雙引號內請填入 http 開頭的網址
  38.   closeLogo: "►",  // 如使用圖檔,雙引號內請填入 http 開頭的網址
  39.   listLogo: "⇢",  // 如使用圖檔,雙引號內請填入 http 開頭的網址
  40.   margin: 10,  // 縮排的像素值
  41.   openText: "全展開",  // 可改為自訂文字, 不顯示文字請改為 ""
  42.   closeText: "全收合",  // 可改為自訂文字, 不顯示文字請改為 "&nbsp;"
  43.   interval: "Y"  // 預設每個大分類之間空一行, 如不要空行請填 "N"
  44. };
  45. //]]>
  46.  
  47. treeLabel.data = [];
  48. treeLabel.labelName = [];
  49.  
  50. <b:loop values='data:labels' var='label'>
  51.  
  52. (function ()  {
  53.   var a = "<data:label.name/>",
  54.       b = a.split("-"),
  55.       l = b.length,
  56.       data = [],
  57.       i;
  58. //<![CDATA[
  59. for(i=0;i<l;i++){if(i!=0&&i!=l-1&&b[i].search(" ")!=0){b[i]=" "+b[i]}data[i]=b[i]};
  60. //]]>
  61.   treeLabel.data.push([data, "<data:blog.languageDirection/>", "<data:label.url/>", "<data:label.count/>"]);
  62. } )();
  63.  
  64. </b:loop>
  65.  
  66. //<![CDATA[
  67. treeLabel.dg=function(a){return document.getElementById(a)};treeLabel.toggle=function(n){var k=treeLabel.dg,o=treeLabel.labelName,b=o.length,p=treeLabel.openLogo,h=treeLabel.closeLogo,m,q,d,g,a,e,c,f;for(e=0;e<b;e++){m=o[e];f=m.length;for(c=0;c<f;c++){q=m.join("")+c;d="logo"+q;g=k(q);a=k(d);if(m[1]&&n==1){if(a&&!a.firstChild.src){a.innerHTML=p}if(a&&a.firstChild.src){a.firstChild.src=p}if(g){g.style.display="block"}}if(m[1]&&n==0){if(a&&!a.firstChild.src){a.innerHTML=h}if(a&&a.firstChild.src){a.firstChild.src=h}if(g){g.style.display="none"}}}}};treeLabel.swap=function(c,d){var f=treeLabel.dg,a=f(d),e=f(c),b=treeLabel.openLogo,g=treeLabel.closeLogo;if(!e.firstChild.src){e.innerHTML=(e.innerHTML==b)?g:b}else{e.firstChild.src=(e.firstChild.src==b)?g:b}a.style.display=(a.style.display=="block")?"none":"block"};(function(){var l=treeLabel.dg,S=treeLabel.data,F=treeLabel.category,R=[],D=[],u=[],f=[],z=F.length,g=S.length,E=treeLabel.showLevel,v=treeLabel.openLogo,e=treeLabel.closeLogo,N=treeLabel.listLogo,d=treeLabel.margin,I=(treeLabel.interval=="Y")?"<p/>":"",w="",t="",m="",a=0,J,A,o,c=l("treeLabel_host"),Q=(window.getComputedStyle)?(window.getComputedStyle(c).display=="none")?"<a href='http://wayne-fu.blogspot.com/2013/01/multi-tree-label-update.html' target='_blank'><img src='http://2.bp.blogspot.com/-nn8uU4LhVtM/T8cdzYQnUZI/AAAAAAAACos/JcGy8V05y84/s1600/info.png' title='Blogger 多層樹狀標籤\n程式設計:WFU BLOG' style='width: 20px; vertical-align: middle;'/></a>":"":"",P,O,M,C,B,K,L,s,H,q,G,h,b,r;v=(v.search("http")<0)?v:"<img src='"+v+"' style='vertical-align: middle;'/>";e=(e.search("http")<0)?e:"<img src='"+e+"' style='vertical-align: middle;'/>";N=(N.search("http")<0)?N:"<img src='"+N+"' style='vertical-align: middle;'/>";S.sort();for(P=0;P<g;P++){treeLabel.labelName[P]=S[P][0];D[P]=S[P][1];u[P]=S[P][2];f[P]=S[P][3]}R=treeLabel.labelName;for(P=0;P<z;P++){for(O=0;O<g;O++){J=R[O];if(J[1]&&J[0]==F[P]){a++;if(a!=0){a=1}L=function(){if(O-1<0){return 0}K=0,A=R[O-1];function i(){if(J[K]==A[K]){K++;i()}}i();return K};M=L();o=function(){if(J[M+1]){H=0;q="";G=J.join("")+M;h="logo"+G;b=(M<E-1)?v:e;r=(M<E-1)?"block":"none";if(treeLabel.showCategoryCount=="Y"){for(C=0;C<g;C++){A=R[C];for(B=M;B>=0;B--){if(J[B]!=A[B]){break}if(J[B]==A[B]&&B==0){H+=parseInt(f[C]);q="("+H+")"}}}}w+="<div class='treeLabel_category'><span onclick='treeLabel.swap(\""+h+'","'+G+"\");'><a id='"+h+"' href='javascript:' style='margin-left:"+M*d+"px;'>"+b+"</a>";w+="<span class='treeLabel_catText'><a href='javascript:'> "+J[M]+" </a></span></span><span>"+q+"</span></div><div id='"+G+"' style='display:"+r+"'>";M++;o()}else{w+="<div class='treeLabel_label' style='margin-left:"+M*d+"px;'>"+N+" <a dir='"+D[O]+"' href='"+u[O]+"'><span dir='ltr'>"+J[M]+"</span></a> ("+f[O]+")</div>";A=R[O+1]||"";m="";s=function(){if(M-1>0){m+="</div>";if(!A){M--;s()}else{for(K=M;K>=1;K--){if(J[K-1]!=A[K-1]){K=2;break}if(J[K-1]==A[K-1]&&K==1){break}}if(K==1){m=m.replace("</div>","")}else{M--;s()}}}};s();w+=m}};o()}}if(a==1){w+=I+"</div>";a=0}}l("treeLabel_main").innerHTML=w;t="<a href='javascript:treeLabel.toggle(1);'>"+v+"</a><span class='treeLabel_catText'><a href='javascript:treeLabel.toggle(1);'>"+treeLabel.openText+"</a></span> ";t+="<a href='javascript:treeLabel.toggle(0);'>"+e+"</a><span class='treeLabel_catText'><a href='javascript:treeLabel.toggle(0);'>"+treeLabel.closeText+"</a></span> ";if(navigator.userAgent.indexOf("MSIE")<0){t+=Q}l("treeLabel_toggle").innerHTML=t})();
  68. //]]>
  69. </script>

以上方法來自 http://www.wfublog.com/2013/01/multi-tree-label-update.html


blogger 樹狀標籤

c8cc168 發表在 痞客邦 留言(0) 人氣()

Blogger 網頁地圖

提交 Sitemap 至 google   http://www.google.com/webmasters

提交 Sitemap 至 yahoo Binge  https://login.live.com

提交檔案
http://XXXXXX.blogspot.hk/sitemap.xml
http://XXXXXX.blogspot.hk/rss.xml
http://XXXXXX.blogspot.hk/atom.xml?redirect=false
http://XXXXXX.blogspot.hk/feeds/posts/default?orderby=updated
http://XXXXXX.blogspot.hk/atom.xml?redirect=false&start-index=1&max-results=500


========================================================================
其他網頁
要自行制作網頁地圖
網上有網站幫你制作 http://www.xml-sitemaps.com/
制作後下載所有地圖檔案,上載到你的網頁跟目錄.後提交 yahoo , google

Blogger 網頁地圖 | 網頁地圖 | yahoo Binge | google 管理員

c8cc168 發表在 痞客邦 留言(0) 人氣()


css 滑鼠接觸我

css hover 滑鼠接觸改CSS參數
css opacity: 0.1 - 1
1 - 不透明度

<style type="text/css">
.tt {
 opacity: 0.5;
 font-size: 20px;
 color: #066;
}

.tt:hover{
 opacity: 1;
 font-size: 40px;
 color: #C33;
}
</style>


<div class="tt">
css 滑鼠接觸我
</div>


class | opacity透明度 | hover滑鼠接觸

c8cc168 發表在 痞客邦 留言(0) 人氣()

<img height="70" src="https://lh4.googleusercontent.com/-uPkYUu3FcmI/U6t1IjYu7HI/AAAAAAAABYk/GJCWlC6Ddx4/s136/site_logo.gif" style="border: 10px solid red;"  width="70" />
<img height="70" src="https://lh4.googleusercontent.com/-uPkYUu3FcmI/U6t1IjYu7HI/AAAAAAAABYk/GJCWlC6Ddx4/s136/site_logo.gif" style="border: 10px dashed yellow;" width="70" />
<img height="70" src="https://lh4.googleusercontent.com/-uPkYUu3FcmI/U6t1IjYu7HI/AAAAAAAABYk/GJCWlC6Ddx4/s136/site_logo.gif" style="border: 10px double lime;" width="70" />
<img height="70" src="https://lh4.googleusercontent.com/-uPkYUu3FcmI/U6t1IjYu7HI/AAAAAAAABYk/GJCWlC6Ddx4/s136/site_logo.gif" style="border: 10px dotted magenta;" width="100%" />
<img height="70" src="https://lh4.googleusercontent.com/-uPkYUu3FcmI/U6t1IjYu7HI/AAAAAAAABYk/GJCWlC6Ddx4/s136/site_logo.gif" style="border: 10px groove olivedrab;" width="70" />
<img height="70" src="https://lh4.googleusercontent.com/-uPkYUu3FcmI/U6t1IjYu7HI/AAAAAAAABYk/GJCWlC6Ddx4/s136/site_logo.gif" style="border: 10px ridge pink;" width="70" />
<img height="70" src="https://lh4.googleusercontent.com/-uPkYUu3FcmI/U6t1IjYu7HI/AAAAAAAABYk/GJCWlC6Ddx4/s136/site_logo.gif" style="border: 10px inset pink;" width="70" />
<img height="70" src="https://lh4.googleusercontent.com/-uPkYUu3FcmI/U6t1IjYu7HI/AAAAAAAABYk/GJCWlC6Ddx4/s136/site_logo.gif" style="border: 10px outset yellowgreen;" width="70" />

| border 圖框 | img | height | width | https | span | style |border 框線 | border 邊框 |

c8cc168 發表在 痞客邦 留言(0) 人氣()

YouTube 嵌入式播放器参数

目录

概述

本文档介绍了 YouTube 嵌入式播放器可以使用的所有参数。通过在 SWF 网址末尾附加这些参数,您可以设置颜色和边框等内容,还可以设置是否对播放器启用 JavaScript API

参数

以下所有参数均为可选参数。只有 YouTube 嵌入式播放器正式支持这些参数,但其中一部分参数也可用于其他播放器(例如播放列表播放器或自定义播放器)。
rel
值:0 或 1。默认值为 1。用于设置播放器是否应在初始视频开始播放后载入相关视频。按下菜单按钮后,“genie 菜单”中会显示相关视频。如果 rel 设置为 0,则播放器搜索功能会停用。
autoplay
值:0 或 1。默认值为 0。用于设置初始视频是否在载入播放器时自动播放。
loop
值:0 或 1。默认值为 0。如果播放器是单视频播放器,则将值设置为 1 会让该播放器反复播放初始视频。如果播放器是播放列表播放器(或自定义播放器),则会播放播放列表中的所有视频,然后再从第一个视频开始从头播放。
enablejsapi
值:0 或 1。默认值为 0。将该值设置为 1 会启用 Javascript API。有关 Javascript API 及其用法的详细信息,请参见 JavaScript API 文档
playerapiid
值可以是任意字母数字字符串。此设置可以和 JavaScript API 结合使用。有关详细信息,请参见 JavaScript API 文档
disablekb
值:0 或 1。默认值为 0。将该值设置为 1 会停用播放器的键盘控件。键盘控件如下:
     空格键:播放/暂停
     向左箭头:当前视频后退 10%
     向右箭头:当前视频前进 10%
     向上箭头:调高音量
     向下箭头:降低音量
egm
值:0 或 1。默认值为 0。将该值设置为 1 会启用“增强的 Genie 菜单”。这样,只要用户将鼠标移入视频显示区,genie 菜单(如果有的话)就会出现,而不是只在用户按下菜单按钮时出现。
border
值:0 或 1。默认值为 0。将该值设置为 1 会在整个视频播放器周围显示边框。可以使用 color1 参数设置边框的基本色,使用 color2 参数设置辅助色。
color1, color2
值:任何十六进制格式的 RGB 值。color1 代表边框的基本色,color2 代表视频控件栏的背景颜色和边框辅助色。
start
值:正整数。此参数可让播放器从视频中的指定位置开始播放视频,具体位置以距视频开头的秒数表示。请注意,与 seekTo 函数类似,播放器会查找与指定时间最接近的关键帧。也就是说,播放头的定位有时会稍早于请求时间,但通常与请求时间的间隔不超过 2 秒。
fs
值:0 或 1。默认值为 0。将该值设置为 1 会启用全屏按钮。此设置不会对 Chromeless Player 产生影响。请注意,要启用该功能,您需要在嵌入代码中另外添加一些参数。以下示例中的粗体部分用于启用全屏功能:
<object width="425" height="344">
<param name="movie" value="https://www.youtube.com/v/u1zgFlCw8Aw?fs=1"</param>
<param name="allowFullScreen" value="true"></param>
<embed src="https://www.youtube.com/v/u1zgFlCw8Aw?fs=1"
type="application/x-shockwave-flash"
allowfullscreen="true"
width="425" height="344">
</embed>
</object>
hd
值:0 或 1。默认值为 0。默认情况下,将该值设置为 1 即可启用高清播放效果。此设置不会对 Chromeless Player 产生影响。如果视频没有高清版,则此设置无效。如果您启用了此选项,请记住,连接速度较慢的用户可能无法得到最佳的用户体验,除非关闭了 HD。因此,您应确保播放器的大小足以使用原生分辨率显示视频。
showsearch
值:0 或 1。默认值为 1。将该值设置为 0 会禁止搜索框在视频最小化的情况下显示。请注意,如果 rel 参数设置为 0,那么,不管 showsearch 设为哪一个值,都会停用搜索框。
showinfo
值:0 或 1。默认值为 1。将该值设置为 0,播放器就不会在开始播放视频之前显示相关信息(例如视频标题和评分)。
iv_load_policy
值:1 或 3。默认值为 1。将该值设置为 1 会在默认情况下显示视频注释,而设置为 3 则不会在默认情况下显示视频注释。
cc_load_policy
值:1。默认值根据用户偏好设置决定的。将该值设置为 1 会在默认情况下显示隐藏字幕,即使在用户关闭字幕的情况下也是如此。

用法示例

要使用上述任何一个参数,只需在 YouTube 视频 SWF 网址的末尾附加相应参数即可。
SWF 网址的常见形式如下:
http://www.youtube.com/v/VIDEO_ID
使用 YouTube 数据 API 查找 yt:format=5 <media:content> 网址,您就能通过编程方式访问此类网址。如果上传器停用嵌入功能,则无法使用该格式。
<media:content url="http://www.youtube.com/v/VIDEO_ID" type="application/x-shockwave-flash" medium="video" 
isDefault="true" expression="full" duration="100" yt:format="5"/>
要将颜色方案更改为天蓝色主题,请修改两个 color 参数。
http://www.youtube.com/v/VIDEO_ID?color1=0x2b405b&color2=0x6b8ab6&fs=1
然后,将经过修改的网址添加到嵌入代码中:
<object width="425" height="355">
<param name="movie" value="https://www.youtube.com/v/u1zgFlCw8Aw?rel=1&color1=0x2b405b&
color2=0x6b8ab6&border=1&fs=1
"></param>
<param name="allowFullScreen" value="true"></param>
<embed src="https://www.youtube.com/v/u1zgFlCw8Aw?rel=1&color1=0x2b405b&color2=0x6b8ab6&border=1&fs=1"
type="application/x-shockwave-flash"
width="425" height="355"
allowfullscreen="true"></embed>
</object>
relcolor1color2 和 border 参数已经过修改,以生成带边框的蓝色播放器(如下所示)。由于 rel 参数设置为 1,因此,按下“菜单”按钮也会载入相关视频。

c8cc168 發表在 痞客邦 留言(0) 人氣()

HTML 時間讀取

var d = new Date() , d =
d.getDate() =
d.getDay() =
d.getMonth() =
d.getFullYear() =
d.getHours() =
d.getMinutes() =
d.getSeconds() =
d.getMilliseconds() =

HTML 時間讀取 | getDate | getDay | getMonth | getFullYear | getFullYear | getHours | getMinutes | getSeconds | getMilliseconds

c8cc168 發表在 痞客邦 留言(0) 人氣()

document.URL 讀取URL | indexOf() | substring()

document.URL;
document.URL.indexOf('ug5g')
document.URL.indexOf('com')
document.URL.indexOf('hk')
document.URL.substring(12,16)
document.URL.substring(17,20)
document.URL.length


document.URL | indexOf() | substring()

c8cc168 發表在 痞客邦 留言(0) 人氣()


blur focus 焦点選擇

访问 智 障 肥 強



<a href="http://c8cc168.blogspot.hk/" id="myAnchor">访问 智 障 肥 強</a>

<script type="text/javascript">


function getfocus()
{document.getElementById('myAnchor').focus()}


function losefocus()
{document.getElementById('myAnchor').blur()}

</script>
<input style="cursor:pointer" onclick="getfocus()" type="button" value="获得焦点" />
<input style="cursor:pointer" onclick="losefocus()" type="button" value="失去焦点" />

| css | html | focus | blur | focus() | blur() | cursor: pointer | button | value |

c8cc168 發表在 痞客邦 留言(0) 人氣()

  • Jan 30 Thu 2014 19:01


對象屬性
document.title //設置文檔標題等價於HTML的title標籤
document.bgColor //設置頁面背景色
document.fgColor //設置前景色(文本顏色)
document.linkColor //未點擊過的鏈接顏色
document.alinkColor //激活鏈接(焦點在此鏈接上)的顏色
document.vlinkColor //已點擊過的鏈接顏色
document.URL //設置URL屬性從而在同一窗口打開另一網頁
document.fileCreatedDate //文件建立日期,只讀屬性
document.fileModifiedDate //文件修改日期,只讀屬性
document.fileSize //文件大小,只讀屬性
document.cookie //設置和讀出cookie
document.charset //設置字符集 簡體中文:gb2312
———————————————————————
常用對象方法
document.write() //動態向頁面寫入內容
document.createElement(Tag) //創建一個html標籤對象
document.getElementById(ID) //獲得指定ID值的對象
document.getElementsByName(Name) //獲得指定Name值的對象
document.body.appendChild(oTag)
———————————————————————

body-主體子對象
document.body //指定文檔主體的開始和結束等價於body>/body>
document.body.bgColor //設置或獲取對象後面的背景顏色
document.body.link //未點擊過的鏈接顏色
document.body.alink //激活鏈接(焦點在此鏈接上)的顏色
document.body.vlink //已點擊過的鏈接顏色
document.body.text //文本色
document.body.innerText //設置body>…/body>之間的文本
document.body.innerHTML //設置body>…/body>之間的HTML代碼
document.body.topMargin //頁面上邊距
document.body.leftMargin //頁面左邊距
document.body.rightMargin //頁面右邊距
document.body.bottomMargin //頁面下邊距
document.body.background //背景圖片

document.body.appendChild(oTag) //動態生成一個HTML對象

常用對象事件
document.body.onclick=」func()」 //鼠標指針單擊對象是觸發
document.body.onmouseover=」func()」 //鼠標指針移到對象時觸發
document.body.onmouseout=」func()」 //鼠標指針移出對象時觸發
———————————————————————
location-位置子對象

document.location.hash // #號後的部分
document.location.host // 域名+端口號
document.location.hostname // 域名
document.location.href // 完整URL
document.location.pathname // 目錄部分
document.location.port // 端口號
document.location.protocol // 網絡協議(http:)
document.location.search // ?號後的部分

documeny.location.reload() //刷新網頁
document.location.reload(URL) //打開新的網頁
document.location.assign(URL) //打開新的網頁
document.location.replace(URL) //打開新的網頁
———————————————————————
selection-選區子對象
document.selection
———————————————————————

images集合(頁面中的圖像)

a)通過集合引用
document.images //對應頁面上的img標籤
document.images.length //對應頁面上img標籤的個數
document.images[0] //第1個img標籤
document.images[i] //第i-1個img標籤

b)通過nane屬性直接引用
img name=」oImage」
document.images.oImage //document.images.name屬性

c)引用圖片的src屬性
document.images.oImage.src //document.images.name屬性.src

d)創建一個圖像
var oImage
oImage = new Image()
document.images.oImage.src=」1.jpg」
同時在頁面上建立一個img /標籤與之對應就可以顯示

———————————————————————-

forms集合(頁面中的表單)

a)通過集合引用
document.forms //對應頁面上的form標籤
document.forms.length //對應頁面上/formform標籤的個數
document.forms[0] //第1個/formform標籤
document.forms[i] //第i-1個/formform標籤
document.forms[i].length //第i-1個/formform中的控件數
document.forms[i].elements[j] //第i-1個/formform中第j-1個控件

b)通過標籤name屬性直接引用
/formform name=」Myform」>input name=」myctrl」/>/form
document.Myform.myctrl //document.表單名.控件名

c)訪問表單的屬性
document.forms[i].name //對應form name>屬性
document.forms[i].action //對應/formform action>屬性
document.forms[i].encoding //對應/formform enctype>屬性
document.forms[i].target //對應/formform target>屬性

document.forms[i].appendChild(oTag) //動態插入一個控件
document.all.oDiv //引用圖層oDiv
document.all.oDiv.style.display=」" //圖層設置為可視
document.all.oDiv.style.display=」none」 //圖層設置為隱藏
document.getElementId(」oDiv」) //通過getElementId引用對象
document.getElementId(」oDiv」).style=」"
document.getElementId(」oDiv」).display=」none」
/*document.all表示document中所有對象的集合
只有ie支持此屬性,因此也用來判斷瀏覽器的種類*/

圖層對象的4個屬性
document.getElementById(」ID」).innerText //動態輸出文本
document.getElementById(」ID」).innerHTML //動態輸出HTML
document.getElementById(」ID」).outerText //同innerText
document.getElementById(」ID」).outerHTML //同innerHTML

c8cc168 發表在 痞客邦 留言(0) 人氣()

Blogger 版面的寬度

<b:template-skin>
<b:variable default='930px' name='content.width' type='length' value='1440px'/>
<b:variable default='0' name='main.column.left.width' type='length' value='180px'/>
<b:variable default='360px' name='main.column.right.width' type='length' value='180px'/>

<![CDATA[
body {
min-width: 800px;
}

.content-outer, .content-fauxcolumn-outer, .region-inner {
min-width: 800px;
max-width: $(content.width);
width:100%;
}


800px 是要把最小寬度
1440px 是頁面的最大寬度

Blogger | Blogger 版面 | Blogger 版面寬度

c8cc168 發表在 痞客邦 留言(0) 人氣()

document.getElementById("test_string").style.fontSize = "25px";

盒子标签和属性对照
CSS语法(不区分大小写)JavaScript语法(区分大小写)
borderborder
border-bottomborderBottom
border-bottom-colorborderBottomColor
border-bottom-styleborderBottomStyle
border-bottom-widthborderBottomWidth
border-colorborderColor
border-leftborderLeft
border-left-colorborderLeftColor
border-left-styleborderLeftStyle
border-left-widthborderLeftWidth
border-rightborderRight
border-right-colorborderRightColor
border-right-styleborderRightStyle
border-right-widthborderRightWidth
border-styleborderStyle
border-topborderTop
border-top-colorborderTopColor
border-top-styleborderTopStyle
border-top-widthborderTopWidth
border-widthborderWidth
clearclear
floatfloatStyle
marginmargin
margin-bottommarginBottom
margin-leftmarginLeft
margin-rightmarginRight
margin-topmarginTop
paddingpadding
padding-bottompaddingBottom
padding-leftpaddingLeft
padding-rightpaddingRight
padding-toppaddingTop
颜色和背景标签和属性对照
CSS 语法(不区分大小写)JavaScript 语法(区分大小写)
backgroundbackground
background-attachmentbackgroundAttachment
background-colorbackgroundColor
background-imagebackgroundImage
background-positionbackgroundPosition
background-repeatbackgroundRepeat
colorcolor
样式标签和属性对照
CSS语法(不区分大小写)JavaScript 语法(区分大小写)
displaydisplay
list-style-typelistStyleType
list-style-imagelistStyleImage
list-style-positionlistStylePosition
list-stylelistStyle
white-spacewhiteSpace
文字样式标签和属性对照
CSS 语法(不区分大小写)JavaScript 语法(区分大小写)
fontfont
font-familyfontFamily
font-sizefontSize
font-stylefontStyle
font-variantfontVariant
font-weightfontWeight
文本标签和属性对照
CSS 语法(不区分大小写)JavaScript 语法(区分大小写)
letter-spacingletterSpacing
line-breaklineBreak
line-heightlineHeight
text-aligntextAlign
text-decorationtextDecoration
text-indenttextIndent
text-justifytextJustify
text-transformtextTransform
vertical-align
verticalAlign 

c8cc168 發表在 痞客邦 留言(0) 人氣()

GO TO TOP 回到上方 Scroll to Top



<style type='text/css'>
#Dnow-ScrolltoTop {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:100px;background-color: #EEEEEE;background-color: rgba(238, 238, 238, 0.6);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#99EEEEEE',EndColorStr='#99EEEEEE');text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;}
</style>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js' type='text/javascript'></script>

<script type='text/javascript'>
$(function() {
    $.fn.scrollToTop = function() {
    $(this).hide().removeAttr("href");
    if ($(window).scrollTop() != "0") {
        $(this).fadeIn("slow")
    }
    var scrollDiv = $(this);
    $(window).scroll(function() {
        if ($(window).scrollTop() == "0") {
        $(scrollDiv).fadeOut("slow")
        } else {
        $(scrollDiv).fadeIn("slow")
        }
    });
    $(this).click(function() {
        $("html, body").animate({
        scrollTop: 0
        }, "slow")
    })
    }
});
$(function() {
    $("#Dnow-ScrolltoTop").scrollToTop();
});
</script>

<div style='font-size:10px'>
<a href='#' id='Dnow-ScrolltoTop' style='display:none;'>&#9650;回到上方&#9650;<br/>Scroll to Top </a>
</div>

GO TO TOP 回到上方 Scroll to Top

c8cc168 發表在 痞客邦 留言(0) 人氣()

X
Y
<form name="Show">
<input name="MouseX" size="4" style="font-size: 16px;" type="text" value="0" /> X<br />
<input name="MouseY" size="4" style="font-size: 16px;" type="text" value="0" /> Y</form>

<script language="JavaScript1.2">
var IE = document.all?true:false
if (!IE) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
var tempX = 0
var tempY = 0
function getMouseXY(e) {
  if (IE) { // grab the x-y pos.s if browser is IE
    tempX = event.clientX + document.body.scrollLeft
    tempY = event.clientY + document.body.scrollTop
  } else {  // grab the x-y pos.s if browser is NS
    tempX = e.pageX
    tempY = e.pageY
  }
  // catch possible negative values in NS4
  if (tempX < 0){tempX = 0}
  if (tempY < 0){tempY = 0}
  // show the position values in the form named Show
  // in the text fields named MouseX and MouseY
  document.Show.MouseX.value = tempX
  document.Show.MouseY.value = tempY
  return true
}
</script>



| CCS | HTML | style | input | getMouseXY | Event.MOUSEMOVE |

c8cc168 發表在 痞客邦 留言(0) 人氣()

  • Dec 20 Fri 2013 18:50
  • GO TOP

右下角 GO TOP 寫法



<a style="display:scroll;position:fixed;bottom:5px;right:5px;" >
 <table border="0">
 <tbody>
<tr>
<td>
<a href="#" ><font size="3">
<b>GO TOP</b></font></a><br />  
</td>
</tr>
</tbody></table></a>


| GO TOP | display:scroll | position:fixed | bottom:5px;right:5px |

c8cc168 發表在 痞客邦 留言(0) 人氣()