2. 程式人生 > >CSS中嵌入指令碼+DIV下拉列表

CSS中嵌入指令碼+DIV下拉列表

阿新 • • 發佈：2019-01-23
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>Pconcool's Blog</title>
<style>
<!--
BODY {
    background-color: #ffffff;
    SCROLLBAR-FACE-COLOR: #ededed;
    SCROLLBAR-HIGHLIGHT-COLOR: #fafafa;
    SCROLLBAR-SHADOW-COLOR
: #666666;
    SCROLLBAR-3DLIGHT-COLOR: #ffffff;
    SCROLLBAR-ARROW-COLOR: #777777;
    SCROLLBAR-TRACK-COLOR: #fcfcfc;
    SCROLLBAR-DARKSHADOW-COLOR: #ffffff;
}
A:link {
    COLOR: #333333; TEXT-DECORATION: none;line-height: 180%
}
A:visited {
    COLOR: #333333; TEXT-DECORATION: none;line-height:
 180%
}
A:hover {
    COLOR: #DF4F00; TEXT-DECORATION: none;line-height: 180%
}
A:active {
    COLOR: #D41E00; TEXT-DECORATION: none;line-height: 180%
}
body,td{font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif;}
#Layer1 {
    position:absolute;
    border:1px solid #1556B1;
    background
:#EFF7FF;
    color:#073E8B;
    padding:3 4;
    width:200px;
    height:120px;
    z-index:1;
    left: 30px;
    top: 90px;
    overflow:auto;
    table-layout:fixed;
}
input{border:1px solid #808080; background:#fcfcfc; width:200px; height:20px;}
.ajaxtd{cursor:hand; color:#073E8B; white-space:nowrap;}
.onmouse{
    event:expression(
        onmouseover = function(){
            this.style.backgroundColor='#F8FDFF';
            this.style.color='#8B0E07';
        },
        onmouseout = function(){
            this.style.backgroundColor='#EFF7FF';
            this.style.color='#073E8B';
        }
    )
}
-->
</style>
<script language="javascript">
    function showdiv(obj,txt){
    var t,l,tn;
    var e=document.getElementById(txt)
    document.getElementById(obj).style.display="";
    l=e.offsetLeft;
    t=e.offsetTop;
    while(e = e.offsetParent){ 
        tn = e.tagName.toUpperCase();
        
        t += e.offsetTop - (tn =="DIV"&&e.scrollTop?e.scrollTop:0); 
        l += e.offsetLeft - (tn =="DIV"&&e.scrollLeft?e.scrollLeft:0); 
    }
    document.getElementById(obj).style.left=l;
    document.getElementById(obj).style.top=t+21;
    document.getElementById(obj).style.width=e.offsetWidth;
    document.getElementById(obj).style.height=e.offsetHeight
    }
    function hidediv(obj){
        document.getElementById(obj).style.display="none";
    }
    function gettdvalue(obj){
        document.getElementById("txt2").value=document.getElementById(obj).innerText;
    }
</script>
</head>

<body onFocus="hidediv('Layer1')">
<input name="txt2" type="text" id="txt2" onFocus="showdiv('Layer1','txt2')"/>
<div id="Layer1" style="display:none;" onDblClick="hidediv('Layer1')">
    <table cellpadding="2" cellspacing="0" border="0" width="100%">
        <tr>
            <td class="ajaxtd onmouse" onclick="gettdvalue('td1')" id="td1">中國優優網</td>
        </tr>
        <tr>
            <td class="ajaxtd onmouse" onclick="gettdvalue('td2')" id="td2">Http://www.chinauuw.com</td>
        </tr>
        <tr>
            <td class="ajaxtd onmouse" onclick="gettdvalue('td3')" id="td3">Pconcol's Blog</td>
        </tr>
        <tr>
            <td class="ajaxtd onmouse" onclick="gettdvalue('td4')" id="td4">ttp://www.pconcool.com</td>
        </tr>
    </table>
</div>
</body>
</html>

相關推薦

CSS中嵌入指令碼+DIV下拉列表

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"/><title>Pconcool's Blog</title><style>.

分別在javascript和JSP中動態設置下拉列表默認值

技術 bsp 分享 列表 tex align scrip jsp頁面 sin 一.JavaScript中動態設置select標簽中<option>選項的默認值： 比如，要完成下邊這個下拉列表的動態顯示，並且當進行前後翻頁時，下拉列表中的值自動更新為當前頁碼

JavaScript做DIV下拉列表

Posted on 2017-12-07 19:02 神筆碼農 閱讀(847) 評論(0) 編輯 收藏 1.設定下拉列表：   2.設定“menu”預設為隱藏：     display：none；

easyui中實現多個下拉列表聯動

先看下原始碼 <script type="text/javascript" charset="UTF-8"> $(function() { var provinceId = $('#provinceId').combobox({ url : 'p

AngularJS中ng-options實現下拉列表的資料繫結

下拉列表的簡單使用 ng-option指令使用很簡單，只需要繫結兩個屬性： 一個是ng-model用於獲取選定的值； 另一個是ng-options用於確定下拉列表的元素陣列。 <select ng-model="engineer.currentActivit

相於Repeater中使用繫結下拉列表一事 .

關於其它控制元件繫結這一塊網上有很多,但發現repeater這一塊很少,結合網上知識總結如下:     1,在repeater上抓取控制元件及進行資料繫結;       一般是在資料繫結後,或著是在ItemDataBound事件中來處理,下面介紹兩種方法:        

在Mybits中，根據頁面下拉列表當中不同條件，查詢不同的表。

比如說： 情景：在頁面中的下拉列表中有student、teacher倆個數據項， 根據點選不同的資料項條件，進行檢索查詢。 在查詢語句當中會用到  <choose>     <whe

HTML用DIV/CSS實現下拉列表

HTML程式碼： <body> <div class="title" > <h1>SYROS</h1> <ul> <li><a href="">HOME<

（轉）基於MVC4+EasyUI的Web開發框架經驗總結（6）--在頁面中應用下拉列表的處理

ica new web開發 don ext images 如果 bob 獲取 http://www.cnblogs.com/wuhuacong/p/3840321.html 在很多Web界面中，我們都可以看到很多下拉列表的元素，有些是固定的，有些是動態的；有些是字典內容，

Android中的下拉列表

creat get targe eight down things trie XML eat 在Web開發中，HTML提供了下拉列表的實現，就是使用<select>元素實現一個下拉列表，在其中每個下拉列表項使用<option>表示即可。這是在Web開

jquery+css實現下拉列表

aps otto ddc () splay app lec and cti <!DOCTYPE html><html><head><meta charset="UTF-8"><title>fruit</tit

excel怎樣添加的選項卡中含有下拉列表

tar more combo page targe amp 設置 date mic 1 <customUI 2 xmlns="http://schemas.microsoft.com/office/2006/01/customui"> 3

DIV做下拉列表

tle width block 文本 http pla javascrip pan meta <html> <head> <meta charset="utf-8"> <title>下拉列表</title> &l

h5,用css實現下拉列表

gin clas isp pla mar ack 實現 寬高 doc <!DOCTYPE html><html><head><meta charset="utf-8"><style> ul li{ list-st

純css修改下拉列表select的默認樣式

png add OS 覆蓋 lec pad repeat 自定義 -c select的一些默認樣式我們很難修改，比如圖標的替換。接下來就說說如何修改這些默認樣式： html代碼： <div> <select name="">

Html頁面中select下拉列表框別樣用法，一個方法一勞永逸。

select 異步加載很多時候，我們寫from表單面，給select標簽賦值，都采用這種方式：1.MVC中設創建公共的分部視圖；2.直接在前臺面中，插入片段後臺代碼；今天我利用HTML5中的自定義屬性，結合JQ擴展方法，寫一個通用的JS方法，JS代碼如下： $.fn.SetSelect = funct

Linq中datetime的處理以及asp.net下拉列表控件的selectitem，text等的設置顯示處理

selected 接受 str 同時 類型 ddp cte 設置 varchar dhl：報錯：LINQ to Entities 不支持指定的類型成員“Date” Linq如： var v = from l in _dal.Share where l

用純css改變下拉列表select框的默認樣式

隱藏 如何 pos share ack rop href static image 在這篇文章裏，我將介紹如何不依賴JavaScript用純css來改變下拉列表框的樣式。 事情是這樣的，您的設計師團隊向您發送一個新的PSD（Photoshop文檔），它是一個新的網站的最終設

Java中獲取資料庫中的資料，獲取下拉列表中的資料， 獲取省、市、區的資料，根據上一層去控制下一層

$(function() { //validateRule(); getDept(); $("select[name='deptNamee']").change(function() { var deptCode = $("select[name='deptN

Excel: Creating Drop-Down Lists 在Excel中建立下拉列表 Lynda課程中文字幕

Excel: Creating Drop-Down Lists 中文字幕 Excel：建立下拉列表 中文字幕Excel: Creating Drop-Down Lists 通過在Excel電子表格中包含下拉列表，您可以簡化自己和團隊的工作，並確保資料準確輸入 許多人認為它需要先進的