活頁夾 標簽

活頁夾

<style>#Fmi {width:100%; height:95%; } .Dis {display: flex;flex-direction: row;} .FLq {width:100px; height:30px; border: 1px solid black;font-size: 20px ;display: flex; justify-content: center;align-items: center;border-radius:20px 20px 0 0;z-index: 2;background-color:#ffd382;} .FDP {border: 1px solid black;width:100%;height:100%;border-style: solid solid solid solid ;margin-top:-2px;z-index: 0;background-color:#ffd382;} .FLd {display:none;} </style> <div id="Fmi"><img src onerror='FleftA(this,0)'><div class = "Dis"> <div class="FLq" onclick="FleftB(this,0)" >12345</div> <div class="FLq" onclick="FleftB(this,1)" >45678</div> <div class="FLq" onclick="FleftB(this,2)" >abcde</div> <div class="FLd" ><table width="100%" height="100%" ></tr><td style="text-align: center;vertical-align:middle" > <img border="0" data-original-height="183" data-original-width="275" height="50%" src="https://3.bp.blogspot.com/-nu4FJRir9uY/XlZx6vlGdNI/AAAAAAAALng/jiFDqNyOoc8sL4pXu-Gob-J5gsiZjBpQACKgBGAsYHg/s320/33.jfif" width="50%"></td></tr></table></div> <div class="FLd" ><table width="100%" height="100%" ></tr><td style="text-align: center;vertical-align:middle" ><img border="0" data-original-height="168" data-original-width="300" height="50%" src="https://1.bp.blogspot.com/-qdlT76jayRw/XlZx6jbFn5I/AAAAAAAALng/gSc5_jGuWrQFvfyxrSrmV_m-jVkwRbTrQCKgBGAsYHg/s320/s3.jfif" width="50%"></td></tr></table></div> <div class="FLd" ><table width="100%" height="100%" ></tr><td style="text-align: center;vertical-align:middle" ><img border="0" data-original-height="183" data-original-width="275" height="50%" src="https://1.bp.blogspot.com/-m0T_nGuuZek/XlZx6hNzCZI/AAAAAAAALng/soli8mrneIEgFy5cyrLHxCoKFN5nSdhDQCKgBGAsYHg/s320/99.jfif" width="50%"></td></tr></table></div> </div><div class = "FDP"></div> </div> <script>function FleftA(d,i){ var MM = d.parentElement; var Fmi= document.getElementById(d.parentElement.id ); var oneDP = Fmi.children[1].children.length/2; var Dis = Fmi.children[1] ; var FLq = Dis.children ; FLq[i].style.borderStyle ="solid solid none solid" Fmi.children[2].innerHTML = Fmi.children[1].children[oneDP ].innerHTML ; //alert( Fmi.children[1].children.length/2) } function FleftB(d,i){ var ii = d.parentElement.children.length; for(var x = 0 ; x < ii /2 ; x++ ){ d.parentElement.children[x].style.borderStyle ="solid solid solid solid" } ; d.style.borderStyle ="solid solid none solid" ; d.parentElement.parentElement.children[2].innerHTML = d.parentElement.children[i+(ii/2)].innerHTML ; //alert( ii) } </script>

00