{ Winter Code Room }

ตอนที่ 54 : [Ver.2] เปลี่ยนสี dropdown menu - Edit เพิ่มเติม 10/04/57@02.16

  • เนื้อหานิยายตอนนี้เปิดให้อ่าน
  • View : 799
    จำนวนคนให้กำลังใจ : 1 ครั้ง
    21 ม.ค. 59

edit เพิ่มเติม >>เพิ่มข้อบ่งใช้เพิ่มเติมป้องกันความเข้าใจผิดเล็กน้อย -10/04/57@12.59
 

เปลี่ยนสี dropdown menu
(ของบทความใหม่)


โค้ดนี้จะเปลี่ยนสี dropdown menu เมื่อชี้แถบ toolbar ด้านบนแล้ว
ตรงส่วนนี้ค่ะ (ดูตัวอย่างการใช้งานจริงได้ที่ >> Click)

v


**คำเตือน**
v
ข้อจำกัดของโค้ดเปลี่ยนสีแถบ toolbar และ dropdown menu
ก็คือ...
พื้นหลังรองห้ามเป็นรูปภาพ หรือห้ามเป็นพื้นหลังโปร่งใสนะคะ

ทั้งสี toolbar สี dropdown menu สีพื้นหลังรอง และสีพื้นหลังในส่วนเนื้อหา จะต้องเป็นสีเดียวกันเท่านั้น!
ไม่อย่างนั้นเละค่ะ เตือนไว้ก่อนน๊า

 

<style type="text/css">
/*เปลี่ยนสีพื้นหลัง dropdown menu-Sakurai Winter*/
.submenu-home, .submenu-leftside, .ordinary-content, .service, .submenu-main, .search, .board-list a, .board-main, .board-hot, .recommend, .submenu-rightside .setthumbnail, .submenu-rightside .wrap-image, .service .service-admission ul li, .select, .submit, .service-education .gotpromo, .service .service-store ul li, ul.welcome-screen-ul, #usermenu .dropdown-panel, .notifications .dropdown-panel, #usermenu .popup-panel, .notifications .popup-panel, #usermenu .dropdown-panel .seemore, .notifications .dropdown-panel .seemore, #usermenu .popup-panel .seemore, .notifications .popup-panel .seemore, li, ul, .gamelist, .setstore, .submenu-rightside .score.steady, .submenu-rightside .score.orange i,  .submenu-rightside .score.steady i, .submenu-rightside .score.steady span {
background-color: #โค้ดสี !important;
border: none !important;
}
.submenu-home i {
background-color: #โค้ดสี !important; /*สีพื้นหลังไอคอนเล็ก ๆ หน้าเมนูย่อย*/
color: #โค้ดสี !important; /*สีไอคอนเล็ก ๆ หน้าเมนูย่อยของปุ่ม home*/
}
.submenu-home a:hover, .dropdown-panel li:hover>a, .notifications .dropdown-panel li:hover>a, .submenu-leftside .submenu-list>li:hover, .submenu-leftside .submenu-supersub li a:hover, .submenu-more .submenu-main li:hover, .submenu-rightside .view-more:hover, .gamelist .view-more-quiz:hover, .submenu-home li:hover i {
background-color: #โค้ดสี !important; /*สีไฮไลท์ตอนเอาเมาส์ชี้เมนูต่าง ๆ*/
color: #โค้ดสี !important; /*สีตัวหนังสือเวลาเอาเมาส์ชี้*/
}
.submenu-rightside h3, .submenu-more h3, .submenu-rightside .settime, -wrap .submenu-leftside .submenu-list>li>a, .submenu-leftside .submenu-list>li>a, .submenu-leftside .submenu-list>li div, #noti-screen .viewport-header, .noti-screen .viewport-header, #noti-screen li .linkname, .noti-screen li .linkname {
color: #โค้ดสี !important; /*สีตัวหนังสือหัวข้อต่าง ๆ*/
}
ul.cl_pagetab.paging-default {
background: none!important; /*ลบแถบสีตรงจำนวนหน้าคอมเม้นท์-ใช้ได้เฉพาะบทความย่อย*/
}
</style>

[โค้ดที่เกี่ยวข้อง >> เปลี่ยนสีแถบ toolbar ด้านบน]

**โค้ดตัวนี้จะไม่ใส่ลงใปในโค้ดรวมธีมพื้นฐาน (ตอนย่อยที่ 38) นะคะ ใส่เพิ่มเอาเองได้เลย**



 

ให้กำลังใจนักเขียน
นักเขียนได้รับกำลังใจแล้ว!
นักเขียนได้รับกำลังใจแล้ว 1 ครั้ง

391 ความคิดเห็น

  1. #241 ALOHOM_TUAN (@genies) (จากตอนที่ 54)
    วันที่ 27 เมษายน 2558 / 01:27
    ขอโทดนะคะคือว่าเราจะทำแถบ toolbar ให้เป็นสีดำแต่มันไม่เป็นสีดำทั้งหมดอ่ะค่ะ บางส่วนเป็นสีส้มๆแล้วก็ตรงdropdownไม่เปลี่ยนสีให้ด้วยอ่ะค่ะ T^T เราไม่ได้ใช้พื้นหลังตรงไหนเป็นสีใสหรือรูปภาพด้วยนะ ใส่เป็นสีดำหมดเลย แนะนำหน่อยนะคะ ขอบคุณล่วงหน้าค่ะ T/T
    #241
    1
    • #241-1 Sakurai Winter {::: Gg :::} (@sakurai-winter) (จากตอนที่ 54)
      12 พฤษภาคม 2558 / 05:06
      สวัสดีค่ะ ขออภัยที่ตอบช้านะคะ

      - เรื่องสีทูบาร์ที่มีแถบส้ม ๆ อยู่บ้างด้านข้าง นั่นเป็นความตั้งใจของข้าพเจ้าเองที่จะทำให้สีไม่สมบูรณ์
      ส่วนหนึ่งเป็นเพราะต้องการคงเอกลักษณ์ (หรือข้อด้อย) บางอย่างเอาไว้เพื่อดูว่ามีใครที่ก๊อบผลงานของข้าพเจ้าไปโดยที่อ้างว่าเป็นของตัวเองค่ะ ...วิธีแก้ไขในส่วนของสีทูลบาร์ก็คือ ลองย่อ หรือขยายขนาดให้พอดีกับหน้าจอ แล้วสีส้มด้านข้างจะหายไป เหลือแค่เส้นส้ม ๆ ทางด้านขวามือค่ะ

      - ส่วนเรื่องสี dropdown menu ที่ไม่เปลี่ยนสี อันนี้ข้าพเจ้าใช้งานได้ตามปกตินะคะ เพราะก็เอาใช้ใน Winter Dark Theme (บทความแจกธีมของข้าพเจ้าเองค่ะ) ยังไม่มีปัญหาอะไร ไม่แน่ใจนะคะว่าเกิดจากอะไร อาจไปตีกับโค้ดอื่นรึเปล่า เพราะทุกโค้ดของข้าพเจ้าแกะเองทุกตัวค่ะ มันจะใช้ด้วยกันของมันได้ แต่ถ้าใช้โค้ดที่อื่นที่เค้าก็แกะเองเหมือนกัน บางทีอาจใช้ไม่ได้

      *ข้าพเจ้าขอดูโค้ดที่นำไปใช้แล้วบอกว่าใช้ไม่ได้หน่อยได้รึเปล่าคะ จะได้ช่วยดูให้ว่าเกิดจากอะไร

      ขอบคุณที่แจ้งนะคะ หากแก้ไขได้จะรีบแก้ให้อย่างเร็วที่สุด (((^_^)))
      #241-1
  2. #124 THE GOD™ (@minii-lov3r) (จากตอนที่ 54)
    วันที่ 19 เมษายน 2557 / 17:31
    เอาไปใช้ในร้านแจกโค้ดธีมนะค้า เดี๋ยวจะให้เครดิต ♥
    ขอบคุณมากจ้า :)
    #124
    1
  3. #123 LICE′ (@girlmomo) (จากตอนที่ 54)
    วันที่ 19 เมษายน 2557 / 13:23
    ขอบใจมากจ้าา
    #123
    0
  4. #85 มิสปาร์ค. (@ran-shinichi) (จากตอนที่ 54)
    วันที่ 12 เมษายน 2557 / 17:58
    ขอบคุณคะะะ
    #85
    0
  5. #84 ` 와인.사랑해 ▽ (@apitchayaporn) (จากตอนที่ 54)
    วันที่ 12 เมษายน 2557 / 12:29
    ขอบคุณคร้าบบบบบบบบบบบบบบดีมากๆๆเลย ><
    #84
    0
  6. #81 maplesr. (@mpst21) (จากตอนที่ 54)
    วันที่ 11 เมษายน 2557 / 12:50
    ขอบคุณนะคะ ><
    #81
    0
  7. #73 pingแม่น้ำ (@pingpong200842) (จากตอนที่ 54)
    วันที่ 9 เมษายน 2557 / 21:54
    ยืมนะคะ ^^
    #73
    0
  8. #71 ✪ Club_CasiNo ✪ (@hibari18goku59) (จากตอนที่ 54)
    วันที่ 9 เมษายน 2557 / 20:29
    ยืมค่าา
    #71
    0
  9. #69 [12GODs ll ZEUS] LOLI SS★ (@asusa-99) (จากตอนที่ 54)
    วันที่ 9 เมษายน 2557 / 20:19
    ยืมนะคะ
    #69
    0
  10. วันที่ 9 เมษายน 2557 / 18:30
    ขอบคุณจ้า
    #67
    0