天空部落
新聞
註冊 登入
夯集
隨便逛
  • 正妹
  • 熱門
< 1 2 > 下一頁 | 最後一頁 1/2
檢視方式: 列表 摘要
March 22, 2009
光源效果
gill1023 在天空部落發表於23:31:55 | J．圖片效果
<p id="flttgt" style="Filter: light(enabled=1); WIDTH: 200px"><img  src="friend.jpg" /></p>
<span id="holder">光源效果<br>移動滑鼠會看到光柱隨之移動，在圖片區域點選會出現更多的光柱！</span>

 <script language="Javascript">//動態光源效果
 <!--
 var g_numlights=0;
 var blurbs=new Array("1","2","3","4");
 window.onload=setlights;
 document.onclick=keyhandler;
 flttgt.onmousemove=mousehandler;
 //建立光源的集合
 function setlights(){
 flttgt.filters[0].clear();
//測試Addcone方法設置一個錐形光源
flttgt.filters[0].addcone(0,0,5,100,100,255,255,0,60,15);
 if(g_numlights>0){
   flttgt.filters[0].addcone(0,170,5,100,100,255,0,0,60,15);
   if(g_numlights>1){
   flttgt.filters[0].addcone(220,180,5,100,100,0,255,255,60,15);
   if(g_numlights>2){
   flttgt.filters[0].addcone(255,0,5,100,100,255,0,255,60,15);} } } }
 //迴圈光源 
function keyhandler(){
g_numlights=(g_numlights+=1)%4;
holder.innerHTML=blurbs[g_numlights];
setlights();
}
//捕捉滑鼠位置及移動光線的焦點
function mousehandler(){
x=(window.event.x-80);
y=(window.event.y-80);
flttgt.filters[0].movelight(0,x,y,5,1);
if(g_numlights>1){
 flttgt.filters[0].movelight(2,x,y,5,1);
 if(g_numlights>2){
  flttgt.filters[0].movelight(3,x,y,5,1); } }}
-->
</script>


人氣 () | 回應 (1) | 引用 (0)
March 22, 2009
過渡濾鏡 (2)
gill1023 在天空部落發表於23:16:46 | J．圖片效果
<script language="JavaScript">//過渡濾鏡
function startTrans()
{
    window.defaultStatus=SampleID.filters.blendTrans.status;
    SampleID.filters.blendTrans.Apply();
    SampleID.src = "friend.jpg";
    SampleID.filters.blendTrans.Play();
}
function doTrans()
{
    theImg.filters.item(0).Apply();
    theImg.src="friend.jpg";
    theImg.filters.item(0).Play();
}
</script>

</head>

<body>

<img ID="theImg" src="bg1.gif" style="filter:revealTrans(Duration=3.3, Transition=22)" onClick="doTrans()"alt="請重新載入頁面有重新點選滑鼠顯示效果" />在圖片上點選滑鼠後開始示範！

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
過渡濾鏡 (1)
gill1023 在天空部落發表於23:15:17 | J．圖片效果
<script language="JavaScript">//過渡濾鏡
function startTrans()
{
    window.defaultStatus=SampleID.filters.blendTrans.status;
    SampleID.filters.blendTrans.Apply();
    SampleID.src = "friend.jpg";
    SampleID.filters.blendTrans.Play();
}
function doTrans()
{
    theImg.filters.item(0).Apply();
    theImg.src="friend.jpg";
    theImg.filters.item(0).Play();
}
</script>

</head>
<img ID="SampleID" src="bg1.gif" style=" filter:blendTrans(duration=3)" onClick="startTrans()" alt="請重新載入頁面有重新點選滑鼠顯示效果" />在圖片上點選滑鼠後開始示範！

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
四處碰壁的圖片
gill1023 在天空部落發表於23:13:29 | J．圖片效果
<style>
<!--
#superball {position:absolute;left:200px;top:1200px;visibility:hidden;}
-->
</style>

<script language="JavaScript">//四處碰壁的圖片
<!--
var ballWidth = 40;
var ballHeight = 40;
var BallSpeed = 5;
var maxBallSpeed = 20;
var xMax;
var yMax;
var xPos = 0;
var yPos = 0;
var xDir = 'right';
var yDir = 'down';
var superballRunning = true;
var tempBallSpeed;
var currentBallSrc;
var newXDir;
var newYDir;
function initializeBall() {
    if (document.all) {
    xMax = document.body.clientWidth
    yMax = document.body.clientHeight
    document.all("superball").style.visibility = "visible";
    }
    else if (document.layers) {
    xMax = window.innerWidth;
    yMax = window.innerHeight;
    document.layers["superball"].visibility = "show";
    }
    setTimeout('moveBall()',400);
}
function moveBall() {
    if (superballRunning == true) {
    calculatePosition();
    if (document.all) {
    document.all("superball").style.left = xPos + document.body.scrollLeft;
    document.all("superball").style.top = yPos + document.body.scrollTop;
    }
    else if (document.layers) {
    document.layers["superball"].left = xPos + pageXOffset;
    document.layers["superball"].top = yPos + pageYOffset;
    }
    setTimeout('moveBall()',30);
    }
}
function calculatePosition() {
    if (xDir == "right") {
    if (xPos > (xMax - ballWidth - BallSpeed)) {
        xDir = "left";
        }
    }
    else if (xDir == "left") {
    if (xPos < (0 + BallSpeed)) {
        xDir = "right";
        }
    }
    if (yDir == "down") {
        if (yPos > (yMax - ballHeight - BallSpeed)) {
            yDir = "up";
        }
    }
    else if (yDir == "up") {
    if (yPos < (0 + BallSpeed)) {
        yDir = "down";
        }
    }
    if (xDir == "right") {
        xPos = xPos + BallSpeed;
    }
    else if (xDir == "left") {
        xPos = xPos - BallSpeed;
    }
    else {
    xPos = xPos;
    }
    if (yDir == "down") {
        yPos = yPos + BallSpeed;
    }
    else if (yDir == "up") {
        yPos = yPos - BallSpeed;
        }
    else {
        yPos = yPos;
        }
}
if (document.all||document.layers)
window.onload = initializeBall;
window.onresize = new Function("window.location.reload()");
-->
</script>

<p><span id="superball">
  <a href="http://ps.saycoo.com/"><img name="superballImage" src="bg1.gif"  border=0 /> </a>
  </span></p>

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
顯示圖片
gill1023 在天空部落發表於23:09:57 | J．圖片效果
<style>
<!--
h3 {position: absolute;left: 10px;top: 50px;cursor: hand}
-->
</style>
<script language="JavaScript">//顯示圖片
<!--
function MM_findObj(n, d) {
    var p,i,x;
    if(!d) d=document;
    if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
    if(!(x=d[n])&&d.all) x=d.all[n];
    for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
    for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
    return x;
}
function MM_showHideLayers() {
    var i,p,v,obj,args=MM_showHideLayers.arguments;
    for (i=0; i<(args.length-2); i+=3)
    if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v='hide')?'hidden':v; }
    obj.visibility=v; }
}
//-->
</script>

</head>

<body>

<div id="image" style="position:absolute; left:10px; top:0px; width:63px; height:67px;visibility: hidden"><img src="bg1.gif" /></div>
<h3> <font size="+1" onClick="MM_showHideLayers('image','','show')">
顯示圖片</font> </h3>

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
圖文位置
gill1023 在天空部落發表於22:58:45 | J．圖片效果
<style type="text/css">
<!--
#moveobj{z-index:-10;left:0px;position:relative;top:0px}
-->
</style>

<Script  language=javascript>
<!--
function moveit(){
moveTop = document.forms[0].elements[0].value;
moveLeft = document.forms[0].elements[1].value;
moveobj.style.top = moveTop;
moveobj.style.left = moveLeft;
}
//-->
</Script>

</head>
<body>

<div id=moveobj><img src="bg1.gif" /></div>
<p>自由控制圖片<form action=javascript:moveit()>top:
 <input size=5 value=0 name=topnum />
&nbsp;&nbsp; left: <input size=5 value=0 name=leftnum />
 <input type=submit value=移動 name=submit />
</form>


觀看全文...
人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
漣漪效果
gill1023 在天空部落發表於22:53:07 | J．文字效果
<style>
<!--
div.1{position:absolute;filter:alpha(opacity=0)}
div.2{position:absolute;filter:glow(color=blue,strength=2);}
-->
</style>

</head>
<body>

<div class="1">http://ps.saycoo.com/</div>
<div class="2">http://ps.saycoo.com/</div>

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
字跟著滑鼠走
gill1023 在天空部落發表於22:45:43 | J．文字效果
<style>
<!--
.spanstyle {position:absolute;visibility:visible;}
-->
</style>

</head>

<script>//START:字跟著滑鼠走
var x,y
var step=20
var flag=0
var message="http://ps.saycoo.com/"
message=message.split("")
var xpos=new Array()
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50}
var ypos=new Array()
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50}
function handlerMM(e){
    x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
    y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
    flag=1}
function makesnake() {
    if (flag==1 && document.all) {
        for (i=message.length-1; i>=1; i--) {
        xpos[i]=xpos[i-1]+step
        ypos[i]=ypos[i-1]        }
        xpos[0]=x+step
        ypos[0]=y
        for (i=0; i<message.length-1; i++) {
        var thisspan = eval("span"+(i)+".style")
        thisspan.posLeft=xpos[i]
        thisspan.posTop=ypos[i]        }    }
    else if (flag==1 && document.layers) {
        for (i=message.length-1; i>=1; i--) {
        xpos[i]=xpos[i-1]+step
        ypos[i]=ypos[i-1]        }
        xpos[0]=x+step
        ypos[0]=y
        for (i=0; i<message.length-1; i++) {
        var thisspan = eval("document.span"+i)
        thisspan.left=xpos[i]
        thisspan.top=ypos[i]}    }
        var timer=setTimeout("makesnake()",30)}
</script>

<body onLoad="makesnake()">

<script>//END:字跟著滑鼠走
for (i=0;i<=message.length-1;i++) {
    document.write("<span id='span"+i+"'class='spanstyle'>")
    document.write(message[i])
    document.write("</span>")}
if (document.layers){
document.captureEvents(Event.MOUSEMOVE);}
document.onmousemove = handlerMM;
</script>

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
波浪效果
gill1023 在天空部落發表於22:41:36 | J．文字效果
<style>
<!--
.mywave {position:absolute;background=pink;filter: Wave(Add=add,Freq=50,LightStrength=50,Phase=15,Strength=20);}
-->
</style>
<script language=javascript>//波浪效果
<!--
function init() {
if (mywave.filters.Wave.Phase>99)
 mywave.filters.Wave.Phase = 5
if(mywave.filters.Wave.Phase<100){ setInterval("mywave.filters.Wave.Phase=mywave.filters.Wave.Phase+2",50)}
}
//-->
</script>
</head>
<body onLoad="init()">
<div id="mywave" class="mywave" style="position:absolute;filter: Wave(Add=add,Freq=1,LightStrength=50, Phase=15,Strength=20);">
<p align=center style="color:white; font-size:30pt;font-weight: bold"> 波浪效果</p></div>

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
霓虹燈文字
gill1023 在天空部落發表於22:29:23 | J．文字效果

<script language=javaScript>//霓虹燈文字
<!--
var thissize=20
var textfont="標楷體"
var textcolor= new Array()
textcolor[0]="000000"
textcolor[1]="999999"
textcolor[2]="000000"
textcolor[3]="111111"
textcolor[4]="222222"
textcolor[5]="333333"
textcolor[6]="444444"
textcolor[7]="555555"
textcolor[8]="666666"
textcolor[9]="777777"
textcolor[10]="888888"
var message = new Array()
message[0]="http://ps.saycoo.com/"
message[1]="::: Paper Sky．白紙天空 :::"
message[2]="┼ Home．首頁"
message[3]="『吉兒的個人網站』"
i_message=0
var i_strength=0
var i_message=0
var timer
function glowtext() {
    if(document.all) {
        if (i_strength <=17) {
            glowdiv.innerText=message[i_message]
            document.all.glowdiv.style.filter="glow(color="+textcolor[i_strength]+", strength=4)"
            i_strength++
            timer=setTimeout("glowtext()",100)
        }
    else {
        clearTimeout(timer)
        setTimeout("deglowtext()",1500)
        }
    }
}
function deglowtext() {
    if(document.all) {
        if (i_strength >=0) {
            glowdiv.innerText=message[i_message]
            document.all.glowdiv.style.filter="glow(color="+textcolor[i_strength]+", strength=4)"
            i_strength--
            timer=setTimeout("deglowtext()",100)
        }
    else {
        clearTimeout(timer)
        i_message++
        if (i_message>=message.length) {i_message=0}
        i_strength=0
        intermezzo()
        }
    }
}
function intermezzo() {
    glowdiv.innerText=""
    setTimeout("glowtext()",1500)
}
-->
</script>
</head>
<body bgColor=#000000 onload=glowtext()>
<DIV id=glowdiv style="VISIBILITY: visible;POSITION: absolute;TEXT-ALIGN: center"></DIV>

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
區塊樣式
gill1023 在天空部落發表於16:32:03 | C．樣式
<style type="text/css">
<!--
/* ------------------------- */
.v1 { visibility: hidden }
.v2 { display: none }

-->
</style>
</head>
<body>

<p class="v1">
使用支援CSS的瀏覽器來開啟這個檔案, 這個段落將呈現透明。
</p>
<h1> 標題</h1>
<p>
把區塊設定成透明：在標題上方還有一個段落。
</p>

<p class="v2">
使用支援CSS的瀏覽器來開啟這個檔案, 將無法顯示這段文字。
</p>
<h1> 標題</h1>
<p>
把區塊刪除：在標題上方還有一個段落。
</p>

人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
圖片樣式
gill1023 在天空部落發表於16:30:48 | C．樣式
圖片樣式 圖片
sunflower

觀看全文...
人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
導覽列樣式
gill1023 在天空部落發表於16:17:56 | C．樣式


觀看全文...
人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
滑鼠樣式
gill1023 在天空部落發表於16:09:52 | C．樣式

滑鼠游標樣式

cursor: default：滑鼠標移入此框內會改變外觀。

cursor: pointer：滑鼠游標移入此框內會改變外觀。

cursor: crosshair：滑鼠游標移入此框內會改變外觀。

cursor: wait：滑鼠游標移入此框內會改變外觀。

cursor: help：滑鼠游標移入此框內會改變外觀。

cursor: text：滑鼠游標移入此框內會改變外觀。

cursor: move：滑鼠游標移入此框內會改變外觀。

cursor: n-resize：滑鼠游標移入此框內會改變外觀。

cursor: s-resize：滑鼠游標移入此框內會改變外觀。

cursor: w-resize：滑鼠游標移入此框內會改變外觀。

cursor: e-resize：滑鼠游標移入此框內會改變外觀。

cursor: ne-resize：滑鼠游標移入此框內會改變外觀。

cursor: nw-resize：滑鼠游標移入此框內會改變外觀。

cursor: se-resize：滑鼠游標移入此框內會改變外觀。

cursor: sw-resize：滑鼠游標移入此框內會改變外觀。

cursor: url(), pointer;：滑鼠游標移入此框內會改變外觀。



觀看全文...
人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
邊框樣式
gill1023 在天空部落發表於15:51:53 | C．樣式
指定邊框的樣式

none

dotted

dashed

solid

groove

ridge

double

inset

outset

 

 

這個段落把每邊的框線都指定以不同顏色。

 

這個段落把每邊的框線都指定以不同顏色。



觀看全文...
人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
表單內容
gill1023 在天空部落發表於15:41:23 | C．樣式

overflow: scroll 指定了區塊的寬高之後, 有時候會因為內容的字型與字體大小改變致使內容無法容納於區塊之內。當發生這種情況, 可以使用overflow屬性來解決這個問題。

overflow: hidden 指定了區塊的寬高之後, 有時候會因為內容的字型與字體大小改變致使內容無法容納於區塊之內。當發生這種情況, 可以使用overflow屬性來解決這個問題。

overflow: visible 指定了區塊的寬高之後, 有時候會因為內容的字型與字體大小改變致使內容無法容納於區塊之內。當發生這種情況, 可以使用overflow屬性來解決這個問題。

　　　

在表單內容上附加 label



　

製作下拉式選單

製作列示方塊

您從事下列哪一種職業？

將表單的內容群組化

個人資料姓名：
住所：
電話：

上傳檔案

選取您電腦的檔案上傳。

使用圖片製作送出鈕



觀看全文...
人氣 () | 回應 (1) | 引用 (0)
March 22, 2009
表格樣式
gill1023 在天空部落發表於15:39:47 | C．樣式

適用於thead要素
項目 項目 項目
內容 內容 內容
禁止在表格內換行 禁止在表格內換行 禁止在表格內換行

消除圖片下方的間隙

table1
範例圖片
table2
範例圖片
一般顯示方式
此為標題儲存格 標題
此為資料儲存格 資料
使用fixed方式顯示
此為標題儲存格 標題
此為資料儲存格 資料
collapse
標題 標題
資料 資料
資料 資料
separate
標題 標題
資料 資料
資料 資料
指定間隔
標題 標題
資料 資料
資料 資料
指定以show
  標題
資料  
  資料
指定以hide
  標題
資料  
  資料

內框線的顯示方式範例

●border="6" rules="none"
姓名 年齡 性別
XXX 30 男
YYY 25 女
●border="6" rules="cols"
姓名 年齡 性別
XXX 30 男
YYY 25 女
●border="6" rules="rows"
姓名 年齡 性別
XXX 30 男
YYY 25 女


觀看全文...
人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
條列項目
gill1023 在天空部落發表於11:26:37 | C．樣式
  • disc
  • circle
  • square
  • decimal
  • decimal-leading-zero
  • lower-roman
  • upper-roman
  • lower-alpha
  • upper-alpha
  • lower-greek
  1. lower-alpha
  2. lower-alpha
  3. lower-alpha
  1. upper-alpha
  2. upper-alpha
  3. upper-alpha
  1. lower-greek
  2. lower-greek
  3. lower-greek
  1. cjk-ideographic
  2. cjk-ideographic
  3. cjk-ideographic
  1. hiragana
  2. hiragana
  3. hiragana
  1. hiragana-iroha
  2. hiragana-iroha
  3. hiragana-iroha
  1. katakana
  2. katakana
  3. katakana
  1. katakana-iroha
  2. katakana-iroha
  3. katakana-iroha
  • 指定為inside則顯示在條列項目區塊內, 與內文左側對齊。
  • 指定為inside則顯示在條列項目區塊內, 與內文左側對齊。
  • 指定為outside則顯示在條列項目區塊外, 此為預設值。
  • 指定為outside則顯示在條列項目區塊外, 此為預設值。
  1. list-style: none 不顯示項目符號
  2. list-style: none 不顯示項目符號
  3. list-style: none 不顯示項目符號
  1. list-style-type: none 不使用項目符號
  2. list-style-type: none 不使用項目符號
  3. list-style-type: none 不使用項目符號
  • 條列項目1
  • 條列項目2
  • 條列項目3
  • 條列項目1
  • 條列項目2
  • 條列項目3
  1. 條列項目1
  2. 條列項目2
  • 在這個項目中, 設定了項目符號的種類以及位置。
  • 如果所指定的圖片無法顯示為項目符號時, 將以所指定的項目符號取代之。


觀看全文...
人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
文字設定
gill1023 在天空部落發表於11:07:56 | C．樣式

文字設定：overline

文字設定：underline

文字設定：line-through

文字設定：underline overline

This is a pen : 標準

This is a pen : uppercase

This is a pen : lowercase

This is a pen : capitalize

空白、tab以及換行依原始編排呈現 段落A 段落B 段落C

用來設定區塊要素裡所包含的內文首行縮排。

用來設定區塊要素裡所包含的內文首行縮排。

用來設定區塊要素裡所包含的內文首行縮排。

設定單字間距。This is a pen. (normal)

設定單字間距。This is a pen. (1em)

設定單字間距。This is a pen. (2em)

設定文字的字距 (標準)

設定文字的字距(0.5em)

設定文字的字距(1.5em)



觀看全文...
人氣 () | 回應 (0) | 引用 (0)
March 22, 2009
文字連結秀圖片
gill1023 在天空部落發表於00:03:52 | J．圖片效果
<SCRIPT LANGUAGE="JavaScript">
<!--
/*
簡易固定位置圖片變化 by Lionstars
*/
document.write('<div id="pic"></div>');
var Imgs = new Array();
Imgs[0] = "圖片的網址";
Imgs[1] = "圖片的網址";
Imgs[2] = "圖片的網址";
function showPic(picUrl) {
show = document.getElementById("pic");
if (picUrl) {
show.innerHTML = '<img src="' + Imgs[picUrl] + '" border=0>';
} else { show.innerHTML = ''; }
}
//-->
</SCRIPT>



觀看全文...
人氣 () | 回應 (4) | 引用 (0)
March 21, 2009
Shake 網頁搖晃
gill1023 在天空部落發表於22:07:07 | J．視窗效果

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin to hide script contents from old browsers.
function move() {
self.focus();
self.moveBy(10,10);
self.moveBy(-10,-10);
self.moveBy(5,5);
self.moveBy(-5,-5);
self.moveBy(5,5);
self.moveBy(-5,-5);
self.moveBy(10,10);
self.moveBy(-10,-10);
self.moveBy(5,5);
self.moveBy(-5,-5);
self.moveBy(10,10);
self.moveBy(-10,-10);
self.moveBy(5,5);
self.moveBy(-5,-5);
self.moveBy(10,10);
self.moveBy(-10,-10);
self.moveBy(10,10);
self.moveBy(-10,-10);
self.moveBy(5,5);
self.moveBy(-5,-5);
    }
// End the hiding here. -->
</SCRIPT>
</HEAD>
<BODY onLoad="move();">

人氣 () | 回應 (0) | 引用 (0)
August 30, 2008
防止按右鍵／但容易破解
gill1023 在天空部落發表於01:08:24 | J．禁止複製

<SCRIPT language=JavaScript>
document.onmousedown=click;
document.onkeydown=click;
if (document.layers) window.captureEvents(Event.MOUSEDOWN); window.onmousedown=click;
if (document.layers) window.captureEvents(Event.KEYDOWN); window.onkeydown=click;
function click(e){
if (navigator.appName == 'Netscape'){
if (e.which != 1){
alert("請輸入警告文字");
return false;}}
if (navigator.appName == "Microsoft Internet Explorer"){
if (event.button != 1){
alert("請輸入警告文字");
return false;}}}
</SCRIPT> 


下面的語法防止別人框選文字內容，請加在<BODY>裡面
<body ONDRAGSTART="window.event.returnValue=false" ONCONTEXTMENU="window.event.returnValue=false" onSelectStart="event.returnValue=false"> 


人氣 () | 回應 (0) | 引用 (0)
August 30, 2008
FLASH 開新視窗 ( 可限制視窗大小 / 不要工具列 & 狀態列 & 選單列 )
gill1023 在天空部落發表於00:58:15 | F．動作
<script language="javaScript">
<!--
function MM_openBrWindow(theURL, winName, features){//v2.0
window.open(theURL,winName,features);}
//-->
</script>

on (release) {
getURL("javascript:MM_openBrWindow( 'popup_demo.htm','popup_demo', 'width=300,height=300,scrollbars=yes')");
}


參考：
http://tw.knowledge.yahoo.com/question/question?qid=1105052405857
人氣 () | 回應 (0) | 引用 (0)
August 30, 2008
開新視窗(不要工具列.可限制視窗大小)
gill1023 在天空部落發表於00:50:52 | J．視窗效果
 
<script language="javaScript">
<!--
function MM_openBrWindow(theURL, winName, features){//v2.0
window.open(theURL,winName,features);}
//-->
</script>
 
 
<a href="javascript://" onClick="window.open('index.htm','','menubar=no,status=yes,scrollbars=yes,top=200,left=200,toolbar=no,width=600,height=500')">按此看範例</a></font></p>

更改內容:
index.htm 　所要連結的網頁檔名
menubar　yes/no　視窗是否應用選項
status　yes/no　視窗是否要否狀態列
scrollbars　yes/no　視窗是否捲軸
toolbar　yes/no　視窗是否要否工具列
top=200 left=200 視窗開啟的位置
width　視窗寬度
height　視窗高度

人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
霓虹燈的文字效果
gill1023 在天空部落發表於22:32:01 | J．跑馬燈效果

 

<script language="JavaScript">
<!--
var text = "霓虹燈的文字效果！！";
var speed = 1000;
var x = 0;
var color = new Array(
"red",
"blue",
"green",
"black"
);

 

if(navigator.appName == "Netscape")
{
  document.write('<layer id="c"><center>'+text+'</center></layer><br>');
}
if(navigator.appName == "Microsoft Internet Explorer")
{
  document.write('<div id="c"><center>'+text+'</center></div>');
}

 

function changecolor()
{
  if(navigator.appName == "Netscape")
  {
    document.c.document.write('<center><font color="'+color[x]);
    document.c.document.write('">'+text+'</font></center>');
    document.c.document.close();
  }
  else if (navigator.appName == "Microsoft Internet Explorer"){
    document.all.c.style.color = color[x];
  }

 

  if(x < color.length-1)
  {
    x=x+1
  }
  else
  { 
    x = 0;
  }
}

 

setInterval("changecolor()",1000);

//-->
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
波浪的文字效果
gill1023 在天空部落發表於22:31:41 | J．跑馬燈效果
<script language="JavaScript">
<!--
function fontsize(text){
   var msg="";
   var flag=0;
   var size=0;
   for(i=0;i<text.length;i=i+1)
   {
      if (flag==0)
      {
        size=size+1;
        if (size>=7)  flag=1
      }
      if (flag==1)
      {      
        size=size-1;
        if (size<=0) flag=0
       }
      msg+="<FONT SIZE="+ size + ">" + text.substring(i,i+1) + "</FONT>";
   }
   return msg;
}
document.write("<center>"+fontsize("歡迎光臨！波浪的文字效果！！"))
document.write("</center></font>")
// -->
</script>
人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
文字放大縮小的跑馬燈效果
gill1023 在天空部落發表於22:31:09 | J．跑馬燈效果

 

<script language="Javascript1.2">
<!--
var tags_before_clock = "<center>";
var tags_after_clock  = "</center>";

 

var speed = 100;
var speed2 = 2000;
var biggest_text = 20;

 

var x = 0;
var y = 0;
var themessage, size;
var esize = "</font>";

 

var themessage2 = new Array
 (
    "歡迎光臨！",
    "這裡提供了各種第一手的資訊",
    "文字放大縮小的跑馬燈效果"
  );

 

if(navigator.appName == "Netscape") {
document.write('<layer id="wds"></layer><br>');
}

 

if (navigator.appVersion.indexOf("MSIE") != -1){
document.write('<span id="wds"></span><br>');
}

 

function upwords()
{

 

  themessage = themessage2[y];

 

  if (x < biggest_text)
  {
    x++;
    setTimeout("upwords()",speed);
   }

 

  else
  {
    setTimeout("downwords()",speed2);
  }

 

  if(navigator.appName == "Netscape")
  {
    size = "<font point-size='"+x+"pt'>";
    document.wds.document.write(size+tags_before_clock+themessage
                              +tags_after_clock+esize);
    document.wds.document.close();
  }

 

  if (navigator.appVersion.indexOf("MSIE") != -1)
  {
    wds.innerHTML = tags_before_clock+themessage+tags_after_clock;
    wds.style.fontSize=x+'px'
  }
}

 

function downwords()
{

 

  if (x > 1)
  {
    x--;
    setTimeout("downwords()",speed);
  }

 

  else
  {
    setTimeout("upwords()",speed2);
    y++;
    if (y > themessage2.length - 1) y = 0;
  }

 

  if(navigator.appName == "Netscape")
  {
    size = "<font point-size='"+x+"pt'>";
    document.wds.document.write(size+tags_before_clock+themessage
                              +tags_after_clock+esize);
    document.wds.document.close();
  }

 

  if (navigator.appVersion.indexOf("MSIE") != -1)
  {
    wds.innerHTML = tags_before_clock+themessage+tags_after_clock;
    wds.style.fontSize=x+'px'
   }
}

setTimeout("upwords()",speed);
//-->
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
逐字顯示跑馬燈效果
gill1023 在天空部落發表於22:30:38 | J．跑馬燈效果

 

<script language="Javascript1.2">
<!--
  var tags_before_clock = "<big><center>";
  var tags_after_clock  = "</big></center>";
  var speed = 100;
  var speed2 = 1000;

 

  var mymessage = new Array
  (
    "歡迎光臨！",
    "這裡提供了各種第一手的資訊",
    "逐字顯示跑馬燈效果"
  );

 

  var mymessage2 = mymessage;
  var x = 0;
  var y = 0;

 

  if(navigator.appName == "Netscape")
  {
    document.write('<layer id="ticker"></layer><br>');
  }

 

  if (navigator.appVersion.indexOf("MSIE") != -1)
  {
    document.write('<span id="ticker"></span><br>');
  }

 

  function upticker()
  {
    if (y > mymessage2.length - 1)
    {
      y = 0;
      setTimeout("upticker()",speed);
     }
    else
    {
      if (x > mymessage2[y].length)
      {
        mymessage = mymessage2[y];
        x = 0; y++;
        setTimeout("upticker()",speed2);
       }
      else
      {
        mymessage = mymessage2[y].substring(0,x++);
        setTimeout("upticker()",speed);
      }

 

     if(navigator.appName == "Netscape")
     {
       document.ticker.document.write

 

(tags_before_clock+mymessage+tags_after_clock);
       document.ticker.document.close();
      }

     if (navigator.appVersion.indexOf("MSIE") != -1)
     {
        ticker.innerHTML = tags_before_clock+mymessage+tags_after_clock;
     }
   }
}
setTimeout("upticker()",speed);
//-->
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
文字方框的跑馬燈效果
gill1023 在天空部落發表於22:30:02 | J．跑馬燈效果

 

<script language="JavaScript">
<!--
var msg="歡迎光臨！"
+"文字方框的跑馬燈效果！！"       

 

function banner(){

 

        msg=msg.substring(1,msg.length)+msg.substring(0,1);

 

        document.banner.text.value=msg;

 

        setTimeout("banner()",150);

 

}

//-->
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
左右滑動的跑馬燈效果
gill1023 在天空部落發表於22:29:09 | J．跑馬燈效果

 

<script language="JavaScript">
<!--

 

var x = 0
var speed = 100
var text = "左右滑動的跑馬燈效果！！"
var course = 110
var text2 = text

 

function Scrollforward() {
window.status = text2.substring(0, text2.length)

 

if (course < text2.length) {
setTimeout("Scrollback()", speed)
}

 

else {
text2 = " " + text2

 

setTimeout("Scrollforward()", speed);
}
}

 

function Scrollback() {
window.status = text2.substring(x, text2.length)

 

if (text2.length - x == text.length) {
text2 = text
x = 0

 

setTimeout("Scrollforward()", speed);
}

else {
x++
setTimeout("Scrollback()", speed);
}
}
Scrollforward()
//-->
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
倒退滑動的打字機效果
gill1023 在天空部落發表於22:27:50 | J．跑馬燈效果


<script language="JavaScript">

 

<!--
var current = 0
var x = 0
var y = 0
var speed = 100
var speed2 = 2000

 

type = new Array(3)
type[0]="歡迎光臨！！"
type[1]="這裡提供各種第一手的資訊！！"
type[2]="倒退滑動的打字機效果！！"

 

function typnslide() {
var m = type[current]

 

window.status = m.substring(0, x)
x = x+1

 

if (x == m.length + 1) {
x = 0

 

setTimeout("typnslide2()", speed2)
}

 

else {
setTimeout("typnslide()", speed)
}
}

 

function typnslide2() {
var m = type[current]

 

window.status = m.substring(y, m.length)
y = y+1

 

if (y == m.length) {
y = 0
current=current+1
if (current > type.length - 1) {
current = 0
}
setTimeout("typnslide()", speed)
}

 

else{
setTimeout("typnslide2()", speed)
}
}

typnslide();
//-->
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
前進再倒退的打字機效果
gill1023 在天空部落發表於22:27:05 | J．跑馬燈效果

 

<script language="JavaScript">
<!--
var current = 0
var x = 0
var speed = 100
var back = 20
var speed2 = 2000
var back2 = 1500

 

var type = new Array(3)
type[0]="歡迎光臨！！"
type[1]="這裡提供各種第一手的資訊！！"
type[2]="前進再倒退的打字機效果！！"

 

function typewrite() {
var m = type[current]

 

window.status = m.substring(0, x++)

 

if (x == m.length + 1) {
setTimeout("erase()", back2)
}

 

else {
setTimeout("typewrite()", speed)
}
}

 

function erase() {
var m = type[current]

 

window.status = m.substring(0, x)
x=x-1

 

if (x < 0) {
current++
x=0
setTimeout("typewrite()", speed2)

 

if (current > type.length - 1) {
current = 0
}
}

else {
setTimeout("erase()", back)
}
}
typewrite()
//-->
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
打字機的跑馬燈效果
gill1023 在天空部落發表於22:26:27 | J．跑馬燈效果

 

<script language="JavaScript">
<!--
var current = 0
var x = 0
var speed = 100
var speed2 = 2000

 

var type = new Array(3)
type[0]="歡迎光臨！！"
type[1]="這裡提供各種第一手的資訊！"
type[2]="打字機的跑馬燈效果！"

 

function typewrite() {
var m = type[current]

 

window.status = m.substring(0, x) + "_"
x = x+1

 

if (x == m.length + 1) {
x = 0
current = current+1

 

if (current == type.length) {
current = 0
}

 

setTimeout("typewrite()", speed2)
}

 

else {
setTimeout("typewrite()", speed)
}
}

typewrite()
//-->
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
捲動的跑馬燈效果
gill1023 在天空部落發表於22:25:04 | J．跑馬燈效果

 

<script language="JavaScript">
<!--
  var x = 0
  var y = 0
  var z = 140
  var delay = 50
  var text = "歡迎光臨，這裡提供第一手的資訊，"
  +"捲動的跑馬燈效果"
  while (y < z) {
  y++
  text = " " + text
  }

 

  function scroller() {
  window.status = text.substring(x , text.length);
  x++
  if (x == text.length)  {
  x = 0;
  }
  setTimeout("scroller()", delay);
  }

  scroller();
  //>
</script>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
【onlyIE】－ FILTER 濾鏡效果
gill1023 在天空部落發表於21:36:10 | C．樣式

<DIV style="FILTER: Chroma( Color=#CCCCCC); COLOR: #CCCCCC; BACKGROUND-COLOR: #FFFFFF; WIDTH: 600px; FONT: bold 36pt Verdana, Arial"> 【onlyIE】－ FILTER 濾鏡效果 (文字)</DIV>

<td  style="FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#eeeeee', endColorStr='#666666', gradientType='0');">底色漸層效果 - 1</td>

 

_onlyIE_FILTER.htm


<SPAN style="BACKGROUND: URL(bg_05.gif)">
<DIV style="FILTER: Chroma( Color=#CCCCCC);
COLOR: #CCCCCC; BACKGROUND-COLOR: #FFFFFF;
WIDTH: 600px; FONT: bold 36pt Verdana, Arial">
【onlyIE】－ FILTER 濾鏡效果 (文字)</DIV>
</SPAN>

 


<p>*******************************************************</p>


<table cellpadding="20" cellspacing="5" style="border:5px double #cccccc;">
  <tr>
    <td  style="FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#eeeeee', endColorStr='#666666', gradientType='0');">底色漸層效果 - 1</td>
    <td  style="FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#ff0099', endColorStr='#ff3300', gradientType='0');">底色漸層效果 - 2</td>
    <td style="FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#ffcc00', endColorStr='#ff9900', gradientType='0');">底色漸層效果 - 3</td>
  </tr>
</table>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
顏色列表－(#RRGGBB)
gill1023 在天空部落發表於21:34:52 | H．顏色
FBC4CB B6B4DA B6C9E7 77DDDD FEE4B4 BBE3B3 FFFFEE FFFFDF FFFBF0 FFFBFD FAFFFF FCFFF4
FFF0F2 F4F4FF F2F7FB E8FDF3 FEFAF1 F8FEEF AAA BBB CCC DDD EEE FFF
F58795 9C9ACE 8EAAD7 2DB7B7 FEBE47 7DCC06 EEEEEE F5FFEC F3FAF8 F3F3FA F8F8E7 F7EAF3
FEFCEF F9FEF5 F5FEEF FFF7FB FEF7EE EEF8EC 777799 3F948F 598993 6D6DB8 7B7724 696BB6
E8FDFF F7F7FF E7E7FF CECFFF FEEFD3 CFECC8 003366 005D21 005157 474792 524F18 3F4181
F8F5ED F1FDE8 F1FDE8 FFF0F9 F79AA5 C6DFAD 225588 007D2C 007D88 2260BD 6B5827 5C4D7D
8C7184 37859B 7279CF 467E9D 0B4A9E 42676F 4477AA 009F38 008477 4482DF 8B7332 6D5C96
564551 255867 18575C 00468C 093879 005157 6699CC 00BD42 00B0B0 66A4F1 D8BF87 8878AD
065584 4E799C 20757B 0058B0 666666 007D88 FF3366 FD9302 FF3333 FF0099 D07D02 E30072
0A6CA7 6A94B5 278D96 006AD5 444444 008477 0000AE BD9E4A 006273 0057AE 564827 304270
0C97EB 99B5CC 33BBC6 0281FF FF0000 00B0B0 0084C4 D9E6A6 008EA8 0281FF 796537 627ABB
CE0679 B7005B BE6001 CE3400 990000 CD4E01 BBBBBB BED7BB DEDBA5 9AAEBA CEBE99 D2E0C5
5907F1 3647DE 3300FF 0000FF 0B4A9E 006273 E9781D FFCC00 FFAE29 F7007B 73BAD6 00BA00
AD83FC 141E78 4B81FE 009191 6BAACB 008EA8 CEDDE3 C9C7FA CCDCC5 DBDBC8 AA7755 CD4E01
EFEBEF E1E9FF 73BAD6 C4E9F0 DDEEFF DEDBA5 F7FBFD F4F2FB F1FAF3 FBF9F2 AA7755 CD4E01
FF00CC 7396CE FFFF00 FF3300 FF6600 FFCC00 67ACCD 926FDB 01AD8B A8A526 BBBBBB BED7BB
5E52C5 73BAD6 C4E9F0 FFCBCE 31619C BDCFDE F4FEFE F0F0FF EFF8EC F6F6F0 006699 456D0E
8D238D 24757B 0000FF FFDDE3 f5f5f5 E1E9FF DCECF3 D8D3FE C1DFCA DFD5B5 B69D14 B04600
99CCFF 85B31C FEC518 FAB8DC CFCB7A DFAED3 E7FFC6 F7FFEF 8C7184 9C9ACE D6E7EF EFEBEF
DDEEFF EEF9D7 E8F7F5 E7F9FE F9F5D9 EBFBFC 2C6683 5557AC 467E9D 7B7724 DEDBA5 9AAEBA
77AADD 688C15 77BDA8 EB94B9 B3AD40 D18FC1 00468C 3F4181 18575C 524F18 006273 0074E8
0058B0 5C4D7D 20757B 8B7332 FFEFFF E7C3DE 4B81FE 627ABB 009191 796537 73BAD6 D6D3CE
006AD5 6D5C96 278D96 796537 B04600 963D84 73BAD6 D2E0C5 C4E9F0 CEBE99 EFEBEF E1E9FF
0281FF 8878AD 33BBC6 D8BF87 CEBE99 D2E0C5 FFFF00 FF00CC FF3300 E9781D 5907F1 4E4E9C
A22000 B00058 CE3400 AB5805 796537 4761A5 EFEFF7 F7EBAD EFEFEF CEFFB5 F7FBF7 DEDBA5
3300FF 304270 0000FF 564827 AA0492 9E2101 DBFEDE FFF7E7 B58EB5 EFFBBD 84BE73 F7F3CE
 
 


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
顏色列表－(顏色名稱)
gill1023 在天空部落發表於21:32:56 | H．顏色
000000 Black FFFAFA Snow FFFFF0 Ivory
C0C0C0 Silver F8F8FF GhostWhite F0FFF0 Honeydew
808080 Gray F5F5F5 WhiteSmoke F5FFFA MintCream
FFFFFF White FFFAF0 FloralWhite F0FFFF Azure
800000 Maroon FAF0E6 Linen F0F8FF AliceBlue
FF0000 Red FAEBD7 AntiqueWhite E6E6FA Lavender
800080 Purple FFEFD5 PapayaWhip 2F4F4F DarkSlateGray
FF00FF Fuchsia FFEBCD BlanchedAlmond 696969 DimGray
008000 Green FFE4C4 Bisque A9A9A9 Darkgray
00FF00 Lime FFE4B5 Moccasin D3D3D3 LightGray
808000 Olive FFDEAD NavajoWhite DCDCDC Gaimsboro
FFFF00 Yellow FFDAB9 PeachPuff 778899 LightSlateGray
000080 Navy FFE4E1 MistyRose 708090 SlateGray
0000FF Blue FFF0F5 LavenderBlush B0C4DE LightSteelBlue
008080 Teal FFF5EE Seashell 4682B4 SteelBlue
00FFFF Aqua FDF5E6 OldLace 4169E1 RoyalBlue
191970 MidnightBlue 5F9EA0 CadetBlue 7FFFF00 Chartreuse
00008B DarkBlue 008B8B Darkcyan ADFF2F GreenYellow
0000CD MediumBlue 2E8B57 SeaGreen 32CD32 LimeGreen
1E90FF DodgerBlue 556B2F DarkOliverGreen 9ACD32 YellowGreen
6495ED CornflowerBlue 006400 DarkGreen 6B8E23 OliveDrab
00BFFF DeepSkyBlue 008000 Green BDB76B DarkKhaki
87CEFA LightSkyBlue 228E22 ForestGreen EEE8AA PaleGoldenrod
87CEEB SkyBlue 3CB371 MediumSeaGreen FFF8DC Cornsilk
ADD8E6 LightBlue 8FBC8F DarkSeaGreen F5F5DC Beige
B0E0E6 PowderBlue 66CDAA MediumAquamarine FFFFE0 LightYellow
AFEEEE PaleTurquoise 7FFFD4 Aquamarine FAFAD2 LightGoldenrodYellow
E0FFFF LightCyan 98FB98 PaleGreen FFFACD LemonChiffon
40E0D0 Turquoise 90EE90 LightGreen F5DEB3 Wheat
48D1CC MediumTurquoise 00FF7F SpringGreen DEB887 Burlywood
00CED1 DarkTurquoise 00FA9A MediumSpringGreen D2B48C Tan
20B2AA LightSerGreen 7CFC00 LawnGreen F0E68C Khaki
FFD700 Gold F08080 LightCoral FF00FF Magenta
FFA500 Orange FA8072 Salmon FF00FF Fuchsia
F4A460 SandyBrown FFA07A LightSalmon EE82EE Violet
FF8C00 DarkOrange FF7F50 Coral DDA0DD Plum
DAA520 Goldenrod FF6347 Tomato DA70D6 Orchid
CD853F Peru FF4500 OrangeRed BA55D3 MediumOrchid
B8860B DarkGoldenrod FF0000 Red 9932CC DarkOrchid
D2691E Chocolate DC143C Crimson 9400D3 DarkOrchid
A0522D Sienna C71585 MediumVioletRed 8B008B DarkMagenta
8B4513 SaddleBrown FF1493 DeepPink 800080 Purple
8B0000 DarkRed FF69B4 HotPink 4B0082 Indigo
A52A2A Brown DB7093 PaleVioletRed 483D8B DarkSlateBlue
B22222 Firebrick FFC0CB Pink 8A2BE2 BlueViolet
CD5C5C IndianRed FFB6C1 LightPink 9370DB MediumPurple
BC8F8F RosyBrown D8BFDB Thistle 6A5ACD SlateBlue
E9967A DarkSalmon     7B68EE MediumSlateBlue

人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
表格 變化
gill1023 在天空部落發表於21:31:43 | H．程式碼

.tb1{BORDER-TOP: 1px solid #CCC;BORDER-RIGHT: 1px solid #999;BORDER-BOTTOM: 1px solid #999;BORDER-LEFT: 1px solid #CCC;FONT:bold 12px/26px Arial, Helvetica, sans-serif; color:#FFF;background:#BBB;}

 

 

時間 主題 講者

時間 主題 講者
     

時間 主題 講者
     
     

 



<style type="text/css">
<!--
.tb1{BORDER-TOP: 1px solid #CCC;BORDER-RIGHT: 1px solid #999;BORDER-BOTTOM: 1px solid #999;BORDER-LEFT: 1px solid #CCC;FONT:bold 12px/26px Arial, Helvetica, sans-serif; color:#FFF;background:#BBB;}
-->
</style>

<table border="0" cellpadding="1" cellspacing="0" bgcolor="#000000">
  <tr>
    <td><table border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table></td>
  </tr>
</table>

<p></p>

<table border="0" cellpadding="2" cellspacing="1" bgcolor="#BBBBBB">
  <tr>
    <td bgcolor="#FFFFFF"><table width="100%" border="0" cellpadding="2" cellspacing="0">
      <tr>
        <td class="tb1">時間</td>
        <td class="tb1">主題</td>
        <td class="tb1">講者</td>
      </tr>      
    </table></td>
  </tr>
</table>

<p></p>

<table  border="1" cellpadding="5" cellspacing="0" bordercolor="#CCCCCC" bgcolor="#EEEEEE">
  <tr>
    <td><table  border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td bgcolor="#AAAAAA"><table  border="0" cellpadding="5" cellspacing="1">
          <tr bgcolor="#CCCCCC">
            <td>時間</td>
            <td>主題</td>
            <td>講者</td>
          </tr>
          <tr bgcolor="#FFFFFF">
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
        </table></td>
      </tr>
    </table></td>
  </tr>
</table>

<p></p>

<table border="0" cellpadding="3" cellspacing="0">
  <tr>
    <td><table border="0" cellpadding="0" cellspacing="1" bgcolor="#999999">
      <tr>
        <td><table border="0" cellpadding="5" cellspacing="2" bgcolor="#FFFFFF">
          <tr bgcolor="#DDDDDD">
            <td>時間</td>
            <td>主題</td>
            <td>講者</td>
          </tr>
        </table></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
      <tr>
        <td><table width="100%" border="0" cellpadding="5" cellspacing="1">
          <tr bgcolor="#EEEEEE">
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr bgcolor="#DDDDDD">
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
        </table></td>
      </tr>
    </table></td>
  </tr>
</table>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
轉址
gill1023 在天空部落發表於21:30:06 | H．程式碼

<meta http-equiv="refresh" content="0.5;URL=http://ps.saycoo.com/">


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
Include 網頁
gill1023 在天空部落發表於21:28:54 | H．程式碼


<!-- #include file="url" -->
Asp網頁，副檔名為.asp

<?include "/路徑/檔名"?>
Php網頁，副檔名為.php

[? template("/路徑/檔名");?]


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
iframe 設定
gill1023 在天空部落發表於21:27:40 | H．程式碼


● 在HTML貼上<iframe>程式碼：

1. 連結至網站
<iframe class="i_style" frameborder="0" scrolling="auto" src="http://ps.saycoo.com/" alt="『吉兒的個人網站』" title="『吉兒的個人網站』"></iframe>

2. 連結至頁面
<iframe src="i_test.htm"></iframe>

 

● 在同一頁製作CSS樣式：


<style type="text/css" >
<!--
.i_style{border:0px solid #fff;width:100%;height:100%;scrollbar-face-color: #eee;scrollbar-shadow-color: #ccc;scrollbar-highlight-color: #fff;scrollbar-3dlight-color: #eee;scrollbar-darkshadow-color: #eee;scrollbar-track-color: #fff;scrollbar-arrow-color:#666;}
-->
</style>

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

● <iframe>標籤屬性

參數 / / 說明 / / 範例
  
align / / 對齊，TOP(上)、BOTTOM(下)、LEFT(左)、RIGHT(右)、MIDDLE(中)。 / / align="right"
 
frameborder / / 設定框線粗細 / / frameborder="0"

src / / 指定連結路徑 / / src="http://ps.saycoo.com/"

scrolling / / 捲動軸， yes, no, auto / / scrolling="no"
 
marginwidth / / 左右邊界 / / marginwidth="2"

marginheight / / 上下邊界 / / marginheight="2"

height / / 設定高度 / / height="50" 

width / / 設定寬度 / / width="400"

--------------------------------------------------------------------------------

● 設定捲軸顏色

scrollbar-face-color: #eee;
scrollbar-shadow-color: #ccc;
scrollbar-highlight-color: #fff;
scrollbar-3dlight-color: #eee;
scrollbar-darkshadow-color: #eee;
scrollbar-track-color: #fff;
scrollbar-arrow-color:#666;
scrollbar-base-color: #fff;


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
HTML 程式碼 (基礎)
gill1023 在天空部落發表於21:24:46 | H．程式碼

<!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=big5" />
<title>::: 標題 :::</title>

<link rel="SHORTCUT ICON" href="http://ps.saycoo.com/papersky.ico"/>
<link rel="icon" href="http://ps.saycoo.com/papersky.ico" type="image/ico" />

<script language="JavaScript" src="javascrip.js"></script>

<link href="style.css" rel="stylesheet" type="text/css">
<LINK REL="Stylesheet" TYPE="text/css" href="http://ps.saycoo.com/style.css">

<style type="text/css">
<!--
body{margin:0;padding: 0;font:normal 80%/175%  Verdana, Arial, Helvetica, sans-serif;color: #333;background: #eee;}
A.link:link {COLOR: #0000ff;text-decoration: none;}
A.link:visited {COLOR: #669966;text-decoration: none;}
A.link:hover {COLOR: #CC0000;text-decoration: underline;}
A.link:active {COLOR: #ff0000;text-decoration: none;}
.f1{font: normal 100%/150% Verdana, Arial, sans-serif,Helvetica;color: #000;}
.f2{font: bold 12px/21px Verdana, Arial, sans-serif,Helvetica;color: #000;}
.f3{font: italic small-caps bold 1em/1.5em Verdana, Arial, sans-serif;color: #000;}
#maincontent{text-align: center;}
-->
</style>

<META HTTP-EQUIV="Keywords" CONTENT="關鍵字設定">

</head>

<body>

<!-- HTML註解 :START: MAINCONTENT 中間主要內容-->
<div id="maincontent">

<p>正常&reg;　上標<sup>&reg;</sup>　<span class="f1">f1</span>　<span class="f2">f2</span>　<span class="f3">f3</span>　<a href="http://ps.saycoo.com/" target="_blank" class="link">文字連結</a>　<input name="submit" type="Image" id="submit" src="圖片的網址" alt="表單送出"></p>

</div>
<!-- HTML註解 :END: MAINCONTENT 中間主要內容-->

</body>

</html>
人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
ＣＳＳ設定 (基礎)
gill1023 在天空部落發表於21:22:56 | C．樣式

/*外邊界*/ {margin:0;}
/*內邊界*/ {padding: 0;}

/*文字顏色*/ {COLOR: #000;}
/*背景顏色*/ {background: #fff;}

/*超連結顏色的設定*/ {COLOR: #00f;}
/*消除超連結的底線*/ {text-decoration: none;}
/*顯示超連結的底線*/ {text-decoration: underline;}

/*一般連結*/ A:link {...}
/*已點選過*/ A:visited {...}  
/*游標在上*/ A:hover {...}
/*點選當時*/ A:active {...}

/*文字設定*/ {font: 斜體 變形 粗體 字級/行高 字型;}
{font: italic small-caps bold 1em/1.5em Verdana, Arial, sans-serif,Helvetica;}

font-style: italic;
font-variant: small-caps;
font-weight: bold;
font-size: 1em;
line-height:1.5em;
font-family: Verdana, Arial, sans-serif;

觀看全文...
人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
特殊符號
gill1023 在天空部落發表於21:20:45 | 其他工具

 

正常®　上標®　上標<sup>&reg;</sup>　下標®　下標<sub>&reg;</sub>

! " # $ % & ' ( ) * + , - . / : ; < = > ? @ A [ \ ] ^ _ _ ` { | } ~¡ ¢ £ ¤ ¥ ¦ § ¨ © ª « ¬ ­ ® ¯ ° ± ² ³ ´ µ ¶ · ¸ ¹ º » ¼ ½ ¾ ⅛ ⅜ ⅝ ⅞ ¿

 ſ ƒ Ǻ ǻ Ǽ ǽ Ǿ ǿ ˆ ˇ ˉ ˘ ˙ ˚ ˛ ˜ ˝ ; ΄ ΅ ‐ — ‗ ‘ ' ‚ ‛ “ ” „ † ‡ • … ‰ ′ ″ ‹ › ‼ ‾ ⁄ ⁿ ₣ ₤ ₧ € ℅ ℓ № ™ Ω ℮ ∂ ∆ ∏ ∑ − ∕ ∙ √ ∞ ∫ ≈ ≠ ≤ ≥ □ ▪ ▫ ◊ ● ◦– ∟ ∩ ∫ ≈ ≠ ≡ ≤ ≥ ⌂ ⌐ ⌠ ⌡ ─ │

← ↑ → ↓ ↔ ↕ ↨← ↑ → ↓ ↖ ↗ ↘ ↙
∕ &setmn; &compfn; ∙ √ ∞ &ang90; ∠ &mid; &par; ∩ ∪ ∫ &conint; ∴ &becaus;
≒ ≠ ≡ ≣ &lE; &gE; ⊕ ⊙ ⊥ ⊿ ⌇〜 〝 〞 〡 〢 〣 〤 〥 〦〧 〨 〩 〰

 ┌ ┐ └ ┘ ├ ┤ ┬ ┴ ┼ ═ ║ ╒ ╓ ╔ ╕ ╖ ╗ ╘ ╙ ╚ ╛ ╜ ╝ ╞ ╟ ╠ ╡ ╢ ╣ ╤ ╥ ╦ ╧ ╨ ╩ ╪ ╫ ╬

▀ ▄ █ ▌ ▐ ░ ▒ ▓ ■ □ ▪ ▫ ▬ ▲ ► ▼ ◄ ◊ ○ ● ◘ ◙ ◦ ☺ ☻ ☼ ♀ ♂ ♠ ♣ ♥ ♦ ♪ ♫

              : ; < = > [ \ ] { | } « · »


ƒˆ ˇ ˊ ˋ ˍ ˙ ˚ ˜̅Α Β Γ Δ Ε Ζ Η Θ Ι Κ Λ Μ Ν Ξ Ο Π Ρ Σ Τ Υ Φ Χ Ψ Ω
 α β γ δ ε ζ η θ ι κ λ μ ν ξ ο π ρ σ τ υ φ χ ψ ω

‐ – — ― ‖ ‘ ' ‚ “ ” „ † ‡ • ․ ‥ … ‧ ‰ ′ ″ ‵ ‹ › ※ ‾₠ ₡ ₢ ₣ ₤ ₥ ₦ ₧ ₨ ₩ ₪ ₫ €℃ ℅ ℉ ™

1 2 3 4 5 6 7 8 9 0 　０ １ ２ ３ ４ ５ ６ ７ ８ ９
Ⅰ Ⅱ Ⅲ Ⅳ Ⅴ Ⅵ Ⅶ Ⅷ Ⅸ Ⅹ
Ａ Ｂ Ｃ Ｄ Ｅ Ｆ Ｇ Ｈ Ｉ Ｊ Ｋ Ｌ Ｍ Ｎ Ｐ Ｏ Ｐ Ｑ Ｒ Ｓ Ｔ Ｕ Ｖ Ｗ Ｘ Ｙ Ｚ
ａ ｂ ｄ ｃ ｄ ｅ ｆ ｇ ｈ ｉ ｊ ｋ ｌ ｍ ｎ ｏ ｐ ｑ ｒ ｓ ｔ ｕ ｖ ｗ ｘ ｙ ｚ

─ ━ │ ┌ ┐ └ ┘ ├ ┝  ┤ ┥ ┬ ┴ ┼ ┿
 ═ ║ ╒ ╓ ╔ ╕ ╖ ╗ ╘ ╙ ╚  ╛ ╜ ╝
 ╞ ╠ ╡ ╢ ╣ ╤ ╥ ╦ ╧ ╨ ╩ ╪ ╫ ╬

 ╭ ╮ ╯ ╰ ╱ ╲ ╳ 

╴ ▁▂ ▃ ▄ ▅▆ ▇ █ ▉▊▋▌▍▎▏▓ 

▔ ▕■ □ ▲ △ ▼ ▽ ◆ ◇ ○ ◎ ● ◢ ◣ ◤ ◥

★ ☆ ☉ ♀ ♁ ♂、 。 〃 
〈 〉 《 》 「 」 『 』 【 】 】 〒 〔 〕

ㄅ ㄆ ㄇ ㄈ ㄉ ㄊ ㄋ ㄌ ㄍ ㄎ ㄏ ㄐ ㄑ ㄒ ㄓ ㄔ ㄕ ㄖ 
ㄗ ㄘ ㄙ ㄚ ㄛ ㄜ ㄝ ㄞ ㄟ ㄠ ㄡ ㄢ ㄣ ㄤ ㄥ ㄦ ㄧ ㄨ ㄩ

㊣ ＞ ＜ ﹀ ︿︰ ︱ ︳ ︴ ︵ ︶ ︷   ︸ ︹ ︺ ︻ ︼ ︽ ︾ ︿ ﹀ ﹁ ﹂﹃﹄﹉ ﹊ ﹋ ﹌
﹍ ﹎ ﹏﹐ ﹑ ﹒ ﹔ ﹕ ﹖ ﹗ ﹙ ﹚ ﹛ ﹜ ﹝ ﹞ ﹟ ﹠ ﹡ ﹢ ﹣ ﹤ ﹥ ﹦ ﹨

 ﹩ ﹪ ﹫！ ＂ ＃ ＄ ％ ＆ ＇ （ ） ＊ ＋ ， － ． ／ ： ；＜ ＝ ＞ ？ ＠ 
［ ＼ ］ ＾ ＿ ｀ ｛ ｜ ｝ ～ ｡ ｢ ｣ ､ ･ ﾟ ￠ ￡ ￣ ￥



觀看全文...
人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
FLASH 設定 (按鈕)
gill1023 在天空部落發表於21:19:08 | F．動作


■ getURL ■

on (release) {
getURL("http://ps.saycoo.com/", "_blank");
}

■ ClickTag ■
on (release) {
getURL(clickTag, "_blank");
}

 

 


■ 寄信附加主旨 ■

on (release) {
getURL("mailto:xxxx?Subject=我要報名", "_blank");
}

人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
FLASH 設定 (基礎)
gill1023 在天空部落發表於21:18:11 | F．動作


■ 全螢幕 
fscommand("fullscreen", "true");


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
表單送出 ( input )
gill1023 在天空部落發表於21:15:23 | J．表單元件

按鈕 / 圖

<input type="Image" src="submit.gif" name="submit" id="submit" border="0">

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

 瀏覽 上一頁 / 下一頁

<INPUT  TYPE="button" VALUE="上一頁" OnClick="history.go( -1 );return true;">
<INPUT  TYPE="button" VALUE="下一頁" OnClick="history.go(  1 );return true;">

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

表單元件

<input type="submit" name="Submit" value="送出">
<input type="reset" name="Submit" value="重設">
<input type="submit" name="Submit" value="完成送出 submit">
<input type="reset" name="Submit" value="清除重填 clear">
<input type="text" name="textfield">
<input type="hidden" name="hiddenField">
<textarea name="textarea"></textarea>
<input type="checkbox" name="checkbox" value="checkbox">
<input name="radiobutton" type="radio" value="radiobutton">
<input type="file" name="file">

------------------------------------------------------------------------------------
 
  <label><input type="radio" name="RadioGroup1" value="選項按鈕">1</label>
  <br>
  <label><input type="radio" name="RadioGroup1" value="選項按鈕">2</label>
  <br>
  <label><input type="radio" name="RadioGroup1" value="選項按鈕">3</label>
  <br>
  <label>
  <select name="select" size="1">
    <option>1</option>
    <option>2</option>
    <option>3</option>
  </select>
</label>

------------------------------------------------------------------------------------

    <select name="menu1" onChange="MM_jumpMenu('parent',this,0)">
      <option value="#1">1</option>
      <option value="#2">2</option>
      <option value="#3">3</option>
    </select>
    <input type="button" name="Button1" value="前往" onClick="MM_jumpMenuGo('menu1','parent',0)"><fieldset>

------------------------------------------------------------------------------------

<legend>1</legend></fieldset>

------------------------------------------------------------------------------------

<script type="text/JavaScript">
<!--
function MM_jumpMenu(targ,selObj,restore){ //v3.0
  eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  if (restore) selObj.selectedIndex=0;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_jumpMenuGo(selName,targ,restore){ //v3.0
  var selObj = MM_findObj(selName); if (selObj) MM_jumpMenu(targ,selObj,restore);
}
//-->
</script>
人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
onMouseOver 滑鼠在上 變底圖
gill1023 在天空部落發表於21:13:48 | J．圖片效果

 

<style type="text/css">
<!--
.menu{text-decoration: none;word-spacing:.5em;letter-spacing:.1em;cursor: hand;font: normal 12px/30px Century Gothic,Arial;text-align: center;color: #fff;background: url(bg_01.gif) repeat;height:35px;width: 150px;}
.menu_over{text-decoration: none;word-spacing:1em;letter-spacing:.2em;cursor: hand;font: bold 12px/30px Century Gothic,Arial;text-align: center;color: #000;background: url(bg_02.gif) repeat;height:35px;width: 150px;}
-->
</style>

 
<div class=menu><a href="2.htm"><div onMouseOver="this.className='menu_over';" onMouseOut="this.className='menu';">On Mouse Over</div></a></div>


 ************************************************************

 



<style type="text/css">
<!--
h3 span{display:none}
img{border: 0;}
li{float: left;padding: 20px 3px 0 !important;padding: 10px 3px 0;}

.btn1 {background: url(no1.gif) no-repeat;height: 12px;width: 24px;display: block;}
a.btn1:hover {background: url(no1b.gif) no-repeat;height: 12px;width: 24px;}

.btn2 {background: url(no2.gif) no-repeat;height: 12px;width: 24px;display: block;}
a.btn2:hover {background: url(no2b.gif) no-repeat;height: 12px;width: 24px;}

.btn3 {background: url(no3.gif) no-repeat;height: 12px;width: 24px;display: block;}
a.btn3:hover {background: url(no3b.gif) no-repeat;height: 12px;width: 24px;}

.btn4 {background: url(no4.gif) no-repeat;height: 12px;width: 24px;display: block;}
a.btn4:hover {background: url(no4b.gif) no-repeat;height: 12px;width: 24px;}

#main{width: 150px;margin: 0;padding:0;}
#showpic{width: 100px;height: 100px;background: url(bg_00.gif) repeat;}
#menu{position:absolute;left:120px;top:10px;list-style-type: none;margin: 0;padding: 0;}

-->
</style>


<div id="main">
  <div id="showpic">

<script language="JavaScript">
// JavaScript SHOW PIC /* 簡易固定位置圖片變化 by Lionsta rs*/
document.write('<div id="pic"></div>');
var Imgs = new Array(); //設定圖片的網址
Imgs[0] = "bg_00.gif";
Imgs[1] = "bg_01.gif";
Imgs[2] = "bg_02.gif";
Imgs[3] = "bg_03.gif";
Imgs[4] = "bg_04.gif";

function showPic(picUrl) {
show = document.getElementById("pic");
if (picUrl) {
show.innerHTML = '<img src="' + Imgs[picUrl] + '"  class="">';
} else { show.innerHTML = ''; }
}
</script>

  </div>
    <ul id="menu">
    <li><a class=btn1 href="1.htm" onMouseOver="javacript:showPic('1');" onMouseOut="showPic(1);"><h3><span>1</span></h3></a></li>
    <li><a class=btn2 href="2.htm" onMouseOver="javacript:showPic('2');" onMouseOut="showPic(2);"><h3><span>2</span></h3></a></li>
    <li><a class=btn3 href="3.htm" onMouseOver="javacript:showPic('3');" onMouseOut="showPic(3);"><h3><span>3</span></h3></a></li>
    <li><a class=btn4 href="4.htm" onMouseOver="javacript:showPic('4');" onMouseOut="showPic(4);"><h3><span>4</span></h3></a></li>
  </ul>
</div>


 ************************************************************


<style type="text/css">
<!--
img {border:0;}
.small {POSITION: relative}
.small:hover {Z-INDEX: 50; BACKGROUND: transparent}
.small SPAN { LEFT: -1000px; VISIBILITY: hidden;POSITION: absolute; }
.small:hover SPAN {LEFT:20px; VISIBILITY: visible; TOP:20px;}
-->
</style>


<A class=small href="#nogo"><IMG src="no1.gif"><SPAN><a href="#1"><IMG src="bg_01.gif"></a></SPAN></A>
<A class=small href="#nogo"><IMG src="no2.gif"><SPAN><a href="#2"><IMG src="bg_02.gif"></a></SPAN></A>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
表單送出 ( input ) － button 按鈕
gill1023 在天空部落發表於21:12:12 | J．表單元件

<style type="text/css">
<!--
.btn {color:#050;font:bold 84%/150% trebuchet ms,helvetica,sans-serif;background-color:#fed;border:1px solid;border-top-color:#696;border-left-color:#696;border-right-color:#363;border-bottom-color:#363;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffeeddaa');}
.btn1 {color:#050;font:bold small/150% trebuchet ms,helvetica,sans-serif;}
.btn2 {color:#050;font:bold 84%/150% trebuchet ms,helvetica,sans-serif;background-color:#fed;}
.btn3 {color:#050;font:bold 84%/150% trebuchet ms,helvetica,sans-serif;background-color:#fed;border:1px solid;border-top-color:#696;border-left-color:#696;border-right-color:#363;border-bottom-color:#363;}
.demo1 {color:#333;font:bold 84%/150% trebuchet ms,helvetica,sans-serif;background-color:#fcc;border:1px solid;border-top-color:#999;border-left-color:#999;border-right-color:#666;border-bottom-color:#666;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffffaaaa');}
.demo2 {color:#333;font:bold 84%/150% trebuchet ms,helvetica,sans-serif;background-color:#cec;border:1px solid;border-top-color:#999;border-left-color:#999;border-right-color:#666;border-bottom-color:#666;    filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffaaddaa');}
.demo3 {color:#333;font:bold 84%/150% trebuchet ms,helvetica,sans-serif;background-color:#ccf;border:1px solid;border-top-color:#999;border-left-color:#999;border-right-color:#666;border-bottom-color:#666;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffaaaaff');}
.demo4 {color:#333;font:bold 84%/150% trebuchet ms,helvetica,sans-serif;border:1px solid;border-top-color:#999;border-left-color:#999;border-right-color:#666;border-bottom-color:#666;background-color:#ddd;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffcccccc');}
.demo5 {color:#333;font:bold 84%/150% trebuchet ms,helvetica,sans-serif;background-color:#ecf;border:1px solid;border-top-color:#999;border-left-color:#999;border-right-color:#666;border-bottom-color:#666;    filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffddbbee');}
-->
</style>


<p>
<table border="1" cellpadding="10" cellspacing="5" bordercolor="#CCCCCC" rules="rows">
  <tbody>
    <tr>
      <th align="left">Normal:</th>
      <td><input name="button1" type="button" value=" OK " /></td>
      <td><input name="button2" type="reset" value="Cancel" /></td>
      <td><input name="button3" type="submit" id="button1" value="Submit" /></td>
      <td><input name="rad" value="0" type="radio" /></td>
      <td><input name="checkbox2" type="checkbox" value="0" /></td>
      <td><select name="select2">
        <option>alpha</option>
        <option>beta</option>
        <option>gamma</option>
      </select></td>
    </tr>
    <tr>
      <th align="left">Styled:</th>
      <td><input name="button11" type="button" class="btn"onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')" value=" OK " /></td>
      <td><input name="button22" type="reset" class="btn"onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')" value="Cancel" /></td>
      <td><input name="button33" type="submit" class="btn"onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')" value="Submit" /></td>
      <td><input name="rad" value="1" class="btn" onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')" type="radio" /></td>
      <td><input name="checkbox" type="checkbox" class="btn"onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')" value="1" /></td>
      <td><select name="select" class="btn" onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')">
        <option>delta</option>
        <option>epsilon</option>
        <option>zeta</option>
      </select></td>
    </tr>
  </tbody>
</table>
<hr />

<p>
　<input name="button3" type="button" class="btn" onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')" value=" OK " />
　<input name="button3" type="button" class="btn" onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')" value="Cancel" />
　<input name="button7" type="button" class="btn" value="Submit" />
　<input name="button10" type="button" disabled="disabled" class="btn" onmouseover="hov(this,'btn btnhov')" onmouseout="hov(this,'btn')" value="Submit" />
　<input name="button4" type="button" class="btn1" value="Submit" />
　<input name="button5" type="button" class="btn2" value="Submit" />
　<input name="button6" type="button" class="btn3" value="Submit" />
</p>

<p>
　<input name="button12" type="button" class="demo1"onmouseover="hov(this,'demo1 btnhov')" onmouseout="hov(this,'demo1')" value="ffffaaaa" />
　<input name="button12" type="button" class="demo2"onmouseover="hov(this,'demo2 btnhov')" onmouseout="hov(this,'demo2')" value="ffaaddaa" />
　<input name="button12" type="button" class="demo3"onmouseover="hov(this,'demo3 btnhov')" onmouseout="hov(this,'demo3')" value="ffaaaaff" />
　<input name="button12" type="button" class="demo4"onmouseover="hov(this,'demo4 btnhov')" onmouseout="hov(this,'demo4')" value="ffcccccc" />
　<input name="button12" type="button" class="demo5"onmouseover="hov(this,'demo5 btnhov')" onmouseout="hov(this,'demo5')" value="ffddbbee" />
</p>


人氣 () | 回應 (0) | 引用 (0)
August 28, 2008
視窗 ( 開啟 / 關閉 )
gill1023 在天空部落發表於21:06:14 | J．視窗效果

 

開啟小視窗 (按鈕→圖)
按 "繼續" 開啟小視窗並關閉原視窗，按 "關閉" 關閉原視窗 
*(01.htm)　文字連結 開啟小視窗 -- 不要目錄、定位和工具列
*(02.htm)　子視窗 選單 -- 在開啟的視窗中操作原來的視窗

 

開啟小視窗 (按鈕→圖)

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

按 "繼續" 開啟小視窗並關閉原視窗，按 "關閉" 關閉原視窗

繼續 [o]　關閉 [x]

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

 

*(01.htm)文字連結 開啟小視窗 -- 不要目錄、定位和工具列

open

 

*(02.htm)子視窗 選單 -- 在開啟的視窗中操作原來的視窗

‧第一頁

‧第二頁

‧第三頁

‧原來那頁


開啟小視窗
 01.htm
 02.htm



 

開啟小視窗 (按鈕→圖)

 

<script type="text/JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
}
//-->
</script>

<A href="javascript:;"><img onclick="MM_openBrWindow('http://ps.saycoo.com/','01','width=400,height=320')" src="space.gif" width=120 height=35 border=0 /></A>

<a href="http://ps.saycoo.com/" target="_blank" onClick="NewWindow(this.href,'order','760','665','no','center');return false" onFocus="this.blur()" >

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

 

按 "繼續" 開啟小視窗並關閉原視窗，按 "關閉" 關閉原視窗 

 

<script type="text/javascript">   
function send(){
var URL = window.parent.newURL;
//            alert (document.Redirect.NewURL.value);
window.open('http://ps.saycoo.com/','NewWindow','toolbar=yes,location=yes,directories=no,status=yes,menubar=yes,scrollbars=yes,resizable=yes,copyhistory=yes,width=800,height=600')
self.close()
}
</script>

<a href="javascript:send();">繼續 [o]</a>　<a href="javascript:window.close()">關閉 [x]</a>

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

*(01.htm)　文字連結 開啟小視窗 -- 不要目錄、定位和工具列

<SCRIPT LANGUAGE="JavaScript">
var win=null;
function NewWindow(mypage,myname,w,h,scroll,pos){
if(pos=="random"){LeftPosition=(screen.width)?Math.floor(Math.random()*(screen.width-w)):100;TopPosition=(screen.height)?Math.floor(Math.random()*((screen.height-h)-75)):100;}
if(pos=="center"){LeftPosition=(screen.width)?(screen.width-w)/2:100;TopPosition=(screen.height)?(screen.height-h)/2:100;}
else if((pos!="center" && pos!="random") || pos==null){LeftPosition=0;TopPosition=20}
settings='width='+w+',height='+h+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=yes';
win=window.open(mypage,myname,settings);}
</SCRIPT>

<a href="02.htm" target="_blank" onClick="NewWindow(this.href,'order','100','300','no','center');return false">open</a>

 


*(02.htm)　子視窗 選單 -- 在開啟的視窗中操作原來的視窗

<SCRIPT LANGUAGE="JavaScript1.1">
//在開啟的視窗中操作原來的視窗//
<!--
function GoWin(WO) {
if (opener.closed) {
NewWin=window.open("","MWindow");
NewWin.location.href=WO;
}
else { opener.location.href=WO }
}
//-->
</SCRIPT>

‧<A href="javascript:GoWin('p1.htm')">第一頁</A>
‧<A href="javascript:GoWin('p2.htm')">第二頁</A>
‧<A href="javascript:GoWin('p3.htm')">第三頁</A>
‧<A href="javascript:GoWin('01.htm')">原來那頁</A>


人氣 () | 回應 (0) | 引用 (0)
< 1 2 > 下一頁 | 最後一頁 1/2
檢視行動版網頁  |  檢視正常版網頁
系統公告
熱情贊助
yam揪便宜
個人簡介
個人圖檔
ＩＤ：gill1023
暱稱： 吉兒
生日：1978/10/23
地區：臺北市

Google
yam今日我最殺
記事分類
搜尋此頻道內容
搜尋：
好時光貼曆
行事曆
Feb 2012
S M T W T F S
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29
人氣指數
當日人次:
累積人次:
誰來我家
誰推薦我
我推薦誰
gill1023的最新的回應
最新的引用
  • 目前沒有引用
自由欄位
RSS 訂閱
RSS2
ATOM
CC授權
其它資訊
本部落所刊登之內容，皆由作者個人所提供，不代表 yam 天空部落 本身立場。
POWERED BY
POWERED BY 天空部落
會員登入│免費註冊