html 測試 左右 各一 測試
<div id="LR123456789" >
<div class="UU1"></div>
<textarea class="Ltxt" spellcheck="false" wrap="logical" style="display:none;">
<p style="color:red;font-size:36px;">
左側顯示
</p>
</textarea>
<textarea class="Rtxt" spellcheck="false" wrap="logical" style="display:none;">
<p style="color:blue;font-size:36px;">
右側顯示
</p>
</textarea>
</div>
<script>LRonload('LR123456789',"400");</script>
<style>
.RRtext , .LLtext { font-size:110%;
display:none;
background-color:azure;
width: 100%;
height: 300px;
border: thin solid black;
font-size:18px; }
.LRC { cursor:pointer;
background-color:gainsboro;
float:left; display:
table-cell;
vertical-align: middle;
text-align: center;
width: 80px;
height: 30px;
border: thin solid black;
overflow:auto;
font-size:18px ;}
.LLif , .RRif { font-size:110%;
background-color:azure;
width: 100%;
height: 300px;
border: thin solid black;
font-size:18px;}
</style>
<!-----------------------------reset--------------------------------------->
<script>
function FLRrs(qq1){
Mid= qq1.substring(0,qq1.length-2);
LRd= qq1.substring(qq1.length-2,qq1.length-1);
var x0 = document.getElementById(Mid);
var x1 = x0.getElementsByClassName(LRd+"txt");
document.getElementById(Mid+LRd+"tt").value = x1[0].value;
FLRdp(qq1)
}
</script>
<!-----------------------------input------------------------------------------>
<script>
function FLRtt(qq1){
Mid= qq1.substring(0,qq1.length-2);
LRd= qq1.substring(qq1.length-2,qq1.length-1);
document.getElementById(Mid+LRd+"a").style.backgroundColor = "gainsboro";
document.getElementById(Mid+LRd+"b").style.backgroundColor = "azure";
document.getElementById(Mid+LRd+"tt").style.display='block';
document.getElementById(Mid+LRd+"ff").style.display='none';
}
</script>
<!--------------------------------display ----------CCK----------------------------------------->
<script>
function FLRdp(qq1){
Mid= qq1.substring(0,qq1.length-2);
LRd= qq1.substring(qq1.length-2,qq1.length-1);
document.getElementById(Mid+LRd+"a").style.backgroundColor = "azure";
document.getElementById(Mid+LRd+"b").style.backgroundColor = "gainsboro";
document.getElementById(Mid+LRd+"tt").style.display='none';
document.getElementById(Mid+LRd+"ff").style.display='block';
var Ttext = document.getElementById(Mid+LRd+"tt").value;
var Ri= document.getElementById(Mid+LRd+"ff");
Ri.innerHTML = "";
var ifrw = (Ri.contentWindow) ? Ri.contentWindow : (Ri.contentDocument.document) ? Ri.contentDocument.document : Ri.contentDocument;
ifrw .document.open();
ifrw .document.write(Ttext);
ifrw .document.close();
}
</script>
<!--------------------------------LOAD--------------------------------------------------->
<script>
function LRonload(qq1,hh){
var x0 = document.getElementById(qq1);
var x1 = x0.querySelector(".UU1");
var strVar="";
strVar += "<table border=\"2\" style=\"width: 100%;\">";
strVar += "<tbody>";
strVar += "<tr><td width=\"50%\">";
strVar += "<form>";
strVar += "<div class='LRC' id='" + qq1 + "La' onclick='FLRdp(this.id)'>預覽</div>";
strVar += "<div class='LRC' id='" + qq1 + "Lb' onclick='FLRtt(this.id)'>寫程式</div>";
strVar += "<div class='LRC' id='" + qq1 + "Lc' onclick='FLRrs(this.id)'>還原</div>";
strVar += "<textarea style='height:" + hh + "px' class='LLtext' id='" + qq1 + "Ltt' spellcheck='false' wrap='logical'>LLLLLLLLLLLLLLLLL";
strVar += "<\/textarea>";
strVar += "<iframe style='height:" + hh + "px' class='LLif' id='" + qq1 + "Lff' ><\/iframe>";
strVar += "<\/form>";
strVar += "<\/td><td>";
strVar += "<form>";
strVar += "<div class='LRC' id='" + qq1 + "Ra' onclick='FLRdp(this.id)'>預覽</div>";
strVar += "<div class='LRC' id='" + qq1 + "Rb' onclick='FLRtt(this.id)'>寫程式</div>";
strVar += "<div class='LRC' id='" + qq1 + "Rc' onclick='FLRrs(this.id)'>還原</div>";
strVar += "<textarea style='height:" + hh + "px' class='LLtext' id='" + qq1 + "Rtt' spellcheck='false' wrap='logical'>RRRRRRRRRRRRRRRRRRRRR";
strVar += "<\/textarea>";
strVar += "<\/form>";
strVar += "<iframe style='height:" + hh + "px' class='RRif' id='" + qq1 + "Rff' ><\/iframe>";
strVar += "<\/td><\/tr>";
strVar += "<\/tbody><\/table>";
x1.innerHTML=strVar ;
FLRrs(qq1+"La");
FLRrs(qq1+"Ra");
}
</script>
<!*******************************************************************>
<div id="LR123456789" >
<div class="UU1"></div>
<textarea class="Ltxt" spellcheck="false" wrap="logical" style="display:none;">
<p style="color:red;font-size:36px;">
左側顯示
</p>
</textarea>
<textarea class="Rtxt" spellcheck="false" wrap="logical" style="display:none;">
<p style="color:blue;font-size:36px;">
右側顯示
</p>
</textarea>
</div>
<!----------------------------------------------------------------------------------->
<script>
LRonload('LR123456789',"400");
</script>
沒有留言:
張貼留言