html 測試 上入 下出

html 測試 單入 單出

html 測試 左右 各一 測試

html 測試 左入右出

尾部連結 hbbb(xx)

onload onscroll onresize

2018年4月22日 星期日

Blogger標籤(分類)變成下拉式選單 置頂

頁頂 標籤變成下拉式選單 HTML


<script type="text/javascript">
var pot = document.getElementsByClassName("column-center-outer");
var h_count = pot.length;
for(var i=0;i<h_count;i++) {
    pot[i].addEventListener('mouseover', function (event) {             
document.getElementById('ALL管理員').style.display = "none";
document.getElementById('ALLBlogger').style.display = "none";
document.getElementById('ALLhtml').style.display = "none";
document.getElementById('ALLscript').style.display = "none";
document.getElementById('ALLcss').style.display = "none";
document.getElementById('ALLother').style.display = "none";
            })
        }
</script>



<script type="text/javascript">
function divover(x){
 x ="ALL" + x.substring(3,x.length);
document.getElementById('ALL管理員').style.display = "none";
document.getElementById('ALLBlogger').style.display = "none";
document.getElementById('ALLhtml').style.display = "none";
document.getElementById('ALLscript').style.display = "none";
document.getElementById('ALLcss').style.display = "none";
document.getElementById('ALLother').style.display = "none";
document.getElementById(x).style.display = "block";
document.getElementById(x).size = document.getElementById(x).length;

}</script>


<style>
.ALLselect{background-color: silver;
          border: 3px outset #C0C0C0;
          color: black; cursor: pointer; font-size: 20px;
          width: auto;z-index:999}
.ALLselect option  {background-color: silver;
                    padding:5px 10px;z-index:999}
.ALLselect option:hover {background-color: dodgerblue ;}


#div管理員{width:95px;position: fixed; top:0px;left:402px}
#divBlogger{width:95px;position: fixed; top:0px;left:502px}
#divhtml{width:95px;position: fixed; top:0px;left:602px}
#divscript{width:95px;position: fixed; top:0px;left:702px}
#divcss{width:95px;position: fixed; top:0px;left:802px}
#divother{width:95px;position: fixed; top:0px;left:902px}

#ALL管理員{display: none;width:auto;position: fixed; top:34px;left:402px}
#ALLBlogger{display: none;width:auto;position: fixed; top:34px;left:502px}
#ALLhtml{display: none;width:auto;position: fixed; top:34px;left:602px}
#ALLscript{display: none;width:auto;position: fixed; top:34px;left:702px}
#ALLcss{display: none;width:auto;position: fixed; top:34px;left:802px}
#ALLother{display: none;width:auto;position: fixed; top:34px;left:902px}


</style>


<div id="cckDP">

<div id="div管理員" class='ALLselect' onmouseover='divover(this.id)'>管理員</div>
<select class='ALLselect' id='ALL管理員' size="15" onchange='location=this.options [this.selectedIndex].value;' onblur ='this.style.display="none"' onmouseover='this.focus()'>
<option style="display:none;" />管理員
</select>


<div id="divBlogger" class='ALLselect' onmouseover='divover(this.id)'>Blogger</div>
<select class='ALLselect' id='ALLBlogger' size="15" onchange='location=this.options [this.selectedIndex].value;' onblur ='this.style.display="none"' onmouseover='this.focus()'>
<option style="display:none;" />Blogger
</select>

<div id="divhtml" class='ALLselect' onmouseover='divover(this.id)'>html</div>
<select class='ALLselect' id='ALLhtml' size="15" onchange='location=this.options [this.selectedIndex].value;' onblur ='this.style.display="none"' onmouseover='this.focus()'>
<option style="display:none;" />HTML
</select>

<div id="divscript" class='ALLselect' onmouseover='divover(this.id)'>script</div>
<select class='ALLselect' id='ALLscript' size="15" onchange='location=this.options [this.selectedIndex].value;' onblur ='this.style.display="none"' onmouseover='this.focus()'>
<option style="display:none;" />Script
</select>

<div id="divcss" class='ALLselect' onmouseover='divover(this.id)'>CSS</div>
<select class='ALLselect' id='ALLcss' size="15" onchange='location=this.options [this.selectedIndex].value;' onblur ='this.style.display="none"' onmouseover='this.focus()'>
<option style="display:none;" />CSS
</select>

<div id="divother" class='ALLselect' onmouseover='divover(this.id)'>other</div>
<select class='ALLselect' id='ALLother' size="15" onchange='location=this.options [this.selectedIndex].value;' onblur ='this.style.display="none"' onmouseover='this.focus()'>
<option style="display:none;" />other
</select>
</div>

<script type="text/javascript">
var Alllength =  ALLlabel.length;
var i;
for (i = 0 ;i < Alllength; i=i+2 ){
var okok = 0 ;

if(ALLlabel[i].indexOf('管理員') > -1 && okok == 0){
var x = document.getElementById("ALL管理員");
var option = document.createElement("option");
var value = document.createElement("value");
option.text = ALLlabel[i].replace(/管理員/,"");
option.value =ALLlabel[i+1];
x.add(option);okok=1;}

if(ALLlabel[i].indexOf('Blogger') > -1 && okok == 0){
var x = document.getElementById("ALLBlogger");
var option = document.createElement("option");
var value = document.createElement("value");
option.text = ALLlabel[i].replace(/Blogger/,"");
option.value =ALLlabel[i+1];
x.add(option);okok=1;}

if(ALLlabel[i].indexOf('標簽') > -1 && okok == 0){
var x = document.getElementById("ALLhtml");
var option = document.createElement("option");
var value = document.createElement("value");
option.text = ALLlabel[i].replace(/標簽/,"");
option.value =ALLlabel[i+1];
x.add(option);okok=1;}

if(ALLlabel[i].indexOf('script') > -1 && okok == 0){
var x = document.getElementById("ALLscript");
var option = document.createElement("option");
var value = document.createElement("value");
option.text = ALLlabel[i].replace(/script/,"");
option.value =ALLlabel[i+1];
x.add(option);okok=1;}

if(ALLlabel[i].indexOf('CSS') > -1 && okok == 0){
var x = document.getElementById("ALLcss");
var option = document.createElement("option");
var value = document.createElement("value");
option.text = ALLlabel[i].replace(/CSS/,"");
option.value =ALLlabel[i+1];
x.add(option);okok=1;}

if(okok == 0){
var x = document.getElementById("ALLother");
var option = document.createElement("option");
var value = document.createElement("value");
option.text = ALLlabel[i];
option.value =ALLlabel[i+1];
x.add(option);okok=1;}

}
</script>

     <script>
        var ALLlabel = [];
         <b:loop values='data:labels' var='label'>
              ALLx1 = &quot;<data:label.name/>&quot;;
              ALLx2 = &quot;<data:label.url/>&quot;;
              ALLlabel.push(ALLx1);
              ALLlabel.push(ALLx2);
</b:loop>
</script>

沒有留言:

張貼留言