監聽Unity編輯器事件，修改Unity編輯器標題

阿新 • • 發佈：2021-02-05

技術標籤：html css

京東頂部導航條（CSS練習4）

效果截圖
京東頂部導航條

程式碼部分

<!DOCTYPE html>
<html lang="ch">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./fa/css/font-awesome.css">
    <link rel="stylesheet" href="./css/reset.css">
    <style>
        body 
 {
            font: 12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;
            background-color: rgb(250, 246, 246);
        }

        .clearfix::before,
        .clearfix::after {
            counter-reset: '';
            display: table;
            clear 
: both;
        }

        .top-wrapper {
            width: 100%;
            background-color: #e3e4e5;
            /* 設定行高，使文字垂直居中 */
            height: 30px;
            line-height: 30px;
            border-bottom: 1px #ddd solid;
        }

        /* 設定內部容器樣式 */
        .top {
            width: 1190px; 

            margin: 0 auto;
            position: relative;
        }

        .top a.hl,
        .top a:hover {
            color: #f10125;
        }

        .top a,
        .top span,
        .top i {
            color: #999;
            text-decoration: none;
        }

        /* 設定導航條左側元素 */
        .fl {
            float: left;
        }

        /* 地址小圖示 */
        .fl .fa {
            color: #f10125;
        }

        /* 設定城市列表效果 */
        .fl .city-list {
            display: none; 
            width: 320px;
            height: 436px;
            background-color: white;
            border: 1px solid rgb(204, 204, 204);
            /* 設定絕對定位，使其不佔據頁面位置 */
            position: absolute;
            top: 30px;
            box-shadow: 0 2px 2px rgba(0, 0, 0, .2);
        }

        /* 滑鼠移入fl時。城市列表顯示出來 */
        .fl:hover .city-list {
            display: block;
        }
        .current-city {
            padding: 0 10px;
            border: 1px solid transparent;
            position: relative;
            z-index: 1;
        }
        /* 移入後fl地址的效果 */
        .fl:hover .current-city{
            background-color: white;
            border: 1px solid rgb(204, 204, 204);
            border-bottom: none;
            padding-bottom: 1px;
        }
        /* 左側城市列表框 */
        .city {
            margin-top: 10px;
        }
        .citys{
            width: 300px;
            height: 190px;
            margin: 0 auto;
        }
        li{
            list-style: none;
            float: left;  
        }
        .city li {                  
            width: 60px;
            height: 24px;
            margin-top: 2px;
            
        }
        .city li a {
            padding: 3px 8px;
        }
        .city li a:hover{
            background-color: rgb(236, 234, 234);
        }

        /* 地區專享版本和Available Site */
        .area{
            height: 90px;
        }
        .country p,
        .area p{
            color: #999;
            margin: 0 15px;
        }
        .country a .word{
            margin-left: 16px;
        }
        .country li,
        .area li{
            width: 130px;
            margin-left: 15px;
            height: 26px;            
        }
        .country li{
            position: relative;
        }

        /* 設定圖示 */
        .country li .log{
            width: 16px;
            height: 14px;
            background-image: url(./img/06/1.png);
            background-repeat: no-repeat;   
            position: absolute;
            top: 8px;
        }
        .country li .log2{
            background-position: -20px 0;   
        }
        .country li .log3{
            background-position: 0 -17px;   
        }
        .country li .log4{
            background-position: -40px 0;   
        }
        .country li .log5{
            background-position: -20px -17px;   
        }

        /* 設定分割線 */
        .split{
            width: 262px;
            margin: 8px 0 3px 16px;
            border-bottom: 1px dotted #eee;
        }    

        /* 設定導航條右側元素 */
        .fr {
            float: right;
        }
        .fr li {
            float: left;
            padding: 0 10px;
        }
        /* .fr #fr-first{
            text-align: left;
            width: 100px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        } */

        /* 設定分割線 */
        .fr .line {
            width: 1px;
            height: 10px;
            padding: 0;
            background-color: #999;
            margin: 12px 0;
        }

        /* 我的京東列表框 */
        .my .myjd-list{
            display: none;
            width: 300px;           
            background-color: white;
            border: 1px solid rgb(204, 204, 204);
            /* 設定絕對定位，使其不佔據頁面位置 */
            position: absolute;
            top: 30px;
            box-shadow: 0 2px 2px rgba(0, 0, 0, .2);
        }
        .my .myjd{        
            padding: 0 5px;  
            border: 1px solid transparent;  
            position: relative;
            z-index: 1;
        }
        .my:hover .myjd-list{
            display: block;
        }
        .my:hover .myjd{
            background-color: white;
            border: 1px solid rgb(204, 204, 204);
            border-bottom: none;
            padding-bottom: 1px;
        }
        
        .myjd-list-first{
            overflow: hidden;
            margin-top: 10px;
            ;
        }
        .myjd-list-last{
            overflow: hidden;
            margin-bottom: 10px;
        }
        .myjd-list-split{
            width: 100%;
            margin: 10px 0;
            border-bottom: 1px dotted #eee;
        }
        .myjd-list-menu{
            width: 110px;
            height: 26px;
            float: left;
            padding: 0px 8px;
            margin-left:6px;
        }
    </style>
</head>

<body>
    <!-- 建立外圍容器 -->
    <div class="top-wrapper">
        <!-- 建立內部容器 -->
        <div class="top clearfix">
            <!-- 左側選單 -->
            <div class="fl">
                <div class="current-city">
                    <i class="fa fa-map-marker"></i>&nbsp;
                    <a href="javascript:;">北京</a>
                </div>
                <div class="city-list">
                    <div class="city">
                        <div class="citys">
                            <li><a href="javascript:;">北京</a></li>
                            <li><a href="javascript:;">上海</a></li>
                            <li><a href="javascript:;">天津</a></li>
                            <li><a href="javascript:;">重慶</a></li>
                            <li><a href="javascript:;">河北</a></li>
                            <li><a href="javascript:;">山西</a></li>
                            <li><a href="javascript:;">河南</a></li>
                            <li><a href="javascript:;">遼寧</a></li>
                            <li><a href="javascript:;">吉林</a></li>
                            <li><a href="javascript:;">黑龍江</a></li>
                            <li><a href="javascript:;">內蒙古</a></li>
                            <li><a href="javascript:;">江蘇</a></li>
                            <li><a href="javascript:;">山東</a></li>
                            <li><a href="javascript:;">安徽</a></li>
                            <li><a href="javascript:;">浙江</a></li>
                            <li><a href="javascript:;">福建</a></li>
                            <li><a href="javascript:;">湖北</a></li>
                            <li><a href="javascript:;">湖南</a></li>
                            <li><a href="javascript:;">廣東</a></li>
                            <li><a href="javascript:;">廣西</a></li>
                            <li><a href="javascript:;">江西</a></li>
                            <li><a href="javascript:;">四川</a></li>
                            <li><a href="javascript:;">海南</a></li>
                            <li><a href="javascript:;">貴州</a></li>
                            <li><a href="javascript:;">雲南</a></li>
                            <li><a href="javascript:;">西藏</a></li>
                            <li><a href="javascript:;">陝西</a></li>
                            <li><a href="javascript:;">甘肅</a></li>
                            <li><a href="javascript:;">青海</a></li>
                            <li><a href="javascript:;">寧夏</a></li>
                            <li><a href="javascript:;">新疆</a></li>
                            <li><a href="javascript:;">港澳</a></li>
                            <li><a href="javascript:;">臺灣</a></li>
                            <li><a href="javascript:;">釣魚島</a></li>
                            <li><a href="javascript:;">海外</a></li>
                        </div>
                    </div>
                    <div class="split"></div>
                    <div class="area">
                        <p>地區專享版本</p>
                        <li><a href="javascript:;">中國港澳</a></li>
                        <li><a href="javascript:;">中國臺灣</a></li>
                        <li><a href="javascript:;">京東全球</a></li>
                    </div>
                    <div class="split"></div>
                    <div class="country">
                        <p>Available Sites</p>
                        <li><a href="javascript:;"><div class="log log1"></div><div class="word">Global Site</div></a></li>
                        <li><a href="javascript:;"><div class="log log2"></div><div class="word">Сайт России</div></a></li>
                        <li><a href="javascript:;"><div class="log log3"></div><div class="word">Situs Indonesia</div></a></li>
                        <li><a href="javascript:;"><div class="log log4"></div><div class="word">Sitio de España</div></a></li>
                        <li><a href="javascript:;"><div class="log log5"></div><div class="word">เว็บไซต์ประเทศไทย</div></a></li>
                    </div>
                </div>
            </div>

            <!-- 右側選單 -->
            <ul class="fr">
                <li>
                    <a href="javascript:;">你好，請登入</a>
                    <a class="hl" href="javascript:;">免費註冊</a>
                </li>
                <!-- 分割線 -->
                <li class="line"></li>
                <li><a href="javascript:;">我的訂單</a></li>
                <li class="line"></li>
                <li class="my">
                    <div class="myjd">
                        <a href="javascript:;">我的京東&nbsp;<i class="fa fa-angle-down"></i></a>                  
                    </div>
                    <div class="myjd-list">
                        <div class="myjd-list-first">
                            <div class="myjd-list-menu"><a href="javascript:;">待處理訂單</a></div>
                            <div class="myjd-list-menu"><a href="javascript:;">訊息</a></div>
                            <div class="myjd-list-menu"><a href="javascript:;">返修退換貨</a></div>
                            <div class="myjd-list-menu"><a href="javascript:;">我的問答</a></div>
                            <div class="myjd-list-menu"><a href="javascript:;">降價商品</a></div>
                            <div class="myjd-list-menu"><a href="javascript:;">我的關注</a></div>                            
                        </div>
                        <div class="myjd-list-split"></div>
                        <div class="myjd-list-last">
                            <div class="myjd-list-menu"><a href="javascript:;">我的京東</a></div>
                            <div class="myjd-list-menu"><a href="javascript:;">我的優惠券</a></div>
                            <div class="myjd-list-menu"><a href="javascript:;">我的白條</a></div>
                            <div class="myjd-list-menu"><a href="javascript:;">我的理財</a></div>
                        </div>
                    </div>
                </li>
                <li class="line"></li>
                <li><a href="javascript:;">京東會員</a></li>
                <li class="line"></li>
                <li>
                    <a class="hl" href="javascript:;">企業採購&nbsp;<i class="fa fa-angle-down"></i></a>                  
                </li>
                <li class="line"></li>
                <li>
                    <span>客戶服務&nbsp;<i class="fa fa-angle-down"></i></span>
                    
                </li>
                <li class="line"></li>
                <li>
                    <span>網址導航</span>
                    <i class="fa fa-angle-down"></i>
                </li>
                <li class="line"></li>
                <span>手機京東</span>
            </ul>
        </div>
    </div>
</body>
</html>

監聽Unity編輯器事件，修改Unity編輯器標題

技術標籤：原創unitywindow 下午看到有這樣需求，然後想到前些天做的去除視窗標題，應該是類似的效果，就去試了下。

layui 監聽複選框事件，被選中的行高亮顯示

table.on(\'checkbox(currentTableFilter)\', function (obj) { debugger if (obj.checked == true) { if (obj.type == \'all\') {

Qt for Android（八） —— QT 監聽 Android 的返回鍵，或者其他Activity 事件

技術標籤：Qt for Android安卓QTqt for android 這篇文章要基於前面的基礎，我們才能繼續下面的內容，建議閱讀。

Spring Boot監聽Redis Key失效事件實現定時任務的示例

業務場景我們以訂單功能為例說明下：生成訂單後一段時間不支付訂單會自動關閉。最簡單的想法是設定定時任務輪詢，但是每個訂單的建立時間不一樣，定時任務的規則無法設定，如果將定時任務執行的間隔設定的過短，太

父元件監聽子元件的事件

子元件暴露一個EventEmitter屬性，當事件發生時，子元件利用該屬性emits(向上彈射)事件。父元件繫結到這個事件屬性，並在事件發生時作出迴應。

子元件監聽props中的值，監聽不到舊值的相關問題

昨天，在專案中做一個功能，一個tab切換，點選其中一個tab的時候，呼叫元件中的查詢方法，切只調用一次。再次切換的時候不再呼叫。

怎麼監聽頁面某個 DOM 元素被修改

MutationObserver 監聽 DOM 樹的改變 MutationObserver 介面提供了監視對DOM樹所做更改的能力。它被設計為舊的Mutation Events功能的替代品，該功能是DOM3 Events規範的一部分。

如何監聽SAP CRM BOR事件

In tcode SWO1 we can find for example business object BUS1178 has defined several events. When you create a new product and save it from WebClient UI, this BOR type will be raised in the following ca

JS如何監聽div的resize事件詳解

需求開發過程中經常遇到的一個問題就是如何監聽一個div的size變化。比如我用canvas繪製了一個chart，當canvas的size發生變化的時候，需要重新繪製裡面的內容，這個時候就需要監聽resize事件做處理。

windows桌面程式設計--監聽全域性鍵盤滑鼠事件

2020-12-29 關鍵字：.NET framework、.NET CORE、.NET、WPF、windows forms、SetWindowsHookEx、鉤子函式

JavaScript監聽DOM的resize事件

1.使用第三方庫　　安裝：npm install observabledomevent -S 　　　　　或者　　　　　yarn addobservabledomevent

Android web View 監聽上傳圖片事件

虛擬碼貼上 @Override protected void onCreate(Bundle savedInstanceState) { mWebView = (WebView) findViewById(R.id.webview); //獲得webView

document.visibilityState 監聽瀏覽器最小化，tab標籤欄之間的切換狀態

本文為joshua317原創文章,轉載請註明：轉載自joshua317部落格https://www.joshua317.com/article/52

uni-app監聽軟鍵盤是否彈起，ios不支援

監聽input輸入框變化，並獲取結果展示在input輸入框下面

.search_content_list {width:374px;display: none;} .search_content_list ul{border:#ddd 1px solid;border-top:none;padding:5px}

vue--如何監聽div裡面的內容，當到達div底部時，自動向上滾動

先說需求：資料實時更新渲染到頁面頁面高度隨資料更新變化預設頁面顯示當前更新內容即滾動條處於頁面最底部當用戶進行滑鼠滾輪向上滾動或者拖動滾動條向上時停止滾動條處於頁面最底部操作當用戶進行上一步操作後又向

DateTimePicker日期時間選擇器中，只需要選擇器，不需要輸入框

vue的element-ui中有個日期時間選擇器，有個需求就是隻需要使用選擇器，而不需要輸入框，也就是說選擇時間的觸發條件是別的事件，比如點選某個按鈕。

Unity如何在Scene中進行一系列操作，例如事件監聽和射線

　　因為有的時候涉及到場景編輯器或者是自定義編輯器等功能，所以有時候需要在Scene介面裡進行一些操作，比如監聽事件等

C#事件管理器如何清空所有監聽詳解

C#事件使用+= -=使用起來是很方便的，但是卻不能整體清空所有事件。比如一個常見的操作，開啟介面註冊監聽事件，關閉介面需要把所有的事件清空了，這要在寫一堆-=操作，如果漏清空的話肯定會造成隱患，如果在lua裡這

video.js事件監聽判斷播放進度，執行動畫

------------恢復內容開始------------ 1 <!DOCTYPE html> 2 <html> 3 4 <head> 5<title>video.html</title>

監聽Unity編輯器事件，修改Unity編輯器標題

京東頂部導航條（CSS練習4）

相關推薦