ข่าว IT ล่าสุด
ถูกใจอย่าลืม Like Fanpage
ขอ Script Css Menuประมาณนี้หน่อยครับ
แสดงแล้ว 25928 ครั้ง /
กรกฎาคม 20, 2012, 07:44
สมาชิกไม่มีภาพ

kanin2604

ออฟไลน์
กระทู้ : 33
คะแนนขอบคุณ : 0
สารานุกรม
ขอ Script Css Menuประมาณนี้หน่อยครับ

ประมาณ menu ของเว็บนี้ครับ  http://www.airgid.com/

ที่ขนาดของเมนูปรับตามขนาดของหน้าจอได้ ครับ

ขอบคุณครับ


Moshi

ออฟไลน์
กระทู้ : 16,996
คะแนนขอบคุณ : 45
it4x สังคมแห่งการเรียนรู้
กรกฎาคม 20, 2012, 14:53
HTML ครับ copy เขาเลยนะครับ

โค๊ด: [Select]
<div id="header"><div class="wrap"><div id="title-area"><p id="title"><a href="http://www.airgid.com/" title="Airgid Media Inc. â&nbsp; Motion Graphics &amp; Interactive â">Airgid Media Inc. â&nbsp; Motion Graphics &amp; Interactive â</a></p></div><div class="widget-area"><div id="nav_menu-2" class="widget widget_nav_menu"><div class="widget-wrap"><div class="menu-primary-navigation-container"><ul id="menu-primary-navigation" class="menu"><li id="menu-item-4" class="work menu-item menu-item-type-custom menu-item-object-custom menu-item-4"><a href="http://airgid.com/work">Work</a></li><li id="menu-item-5" class="reels menu-item menu-item-type-custom menu-item-object-custom menu-item-5"><a href="http://airgid.com/reels">Reels</a></li><li id="menu-item-17" class="blog menu-item menu-item-type-post_type menu-item-object-page menu-item-17"><a href="http://www.airgid.com/blog/">Blog</a></li><li id="menu-item-14" class="about menu-item menu-item-type-post_type menu-item-object-page menu-item-14"><a href="http://www.airgid.com/about/">About</a></li><li id="menu-item-11" class="contact menu-item menu-item-type-post_type menu-item-object-page menu-item-11"><a href="http://www.airgid.com/contact/">Contact</a></li></ul></div></div></div></div><div id="sort-content"><div class="plus">&nbsp;</div><div class="label">Sort Content</div></div><div id="sort-content-list"><ul><li><a href="#filter" class="everything">Everything</a></li><li><a href="#filter" class="tax-contests">Contests</a></li><li><a href="#filter" class="tax-illustration">Illustration</a></li><li><a href="#filter" class="tax-motion">Motion</a></li><li><a href="#filter" class="tax-ugc-sites">User Generated Content</a></li><li><a href="#filter" class="tax-websites">Websites</a></li></ul></div><div id="mobile-nav"><select><option val="">Navigation...</option><option value="http://airgid.com/work">Work</option><option value="http://airgid.com/reels">Reels</option><option value="http://www.airgid.com/blog/">Blog</option><option value="http://www.airgid.com/about/">About</option><option value="http://www.airgid.com/contact/">Contact</option></select></div></div></div><br />
Css Code
โค๊ด: [Select]
body{<br /><span style="white-space: pre;"> </span>margin:0px; padding:0px;<span style="white-space: pre;"> </span><br /><span style="white-space: pre;"> </span>background-color:#f2f2f2}::-moz-selection{background-color:#fbe601;color:#000}::selection{background-color:#fbe601;color:#000}<br /><span style="white-space: pre;"> </span>a{padding:2px<br />0 0 0;text-decoration:none;border-bottom:2px solid #000}body{background-color:#f2f2f2}::-moz-selection{background-color:#fbe601;color:#000}::selection{background-color:#fbe601;color:#000}#wrap{}#header{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-header.png) center no-repeat;margin:0<br />auto;height:70px;width:100%;position:fixed;z-index:99}#header<br />.wrap{margin:0<br />auto;max-width:1180px;position:relative}#header .widget-area{float:left;padding:0;width:400px}#title-area,<br />#title,<br />#title<br />a{display:block;float:left;height:70px;overflow:hidden;padding:0;text-indent:-9999px;width:105px}#title-area{background:#1a1615 url(http://www.airgid.com/wp-content/themes/airgid/images/logo.png) 0 18px no-repeat;margin-left:120px;margin-right:15px;padding-right:25px}#title a:hover{background:url(http://www.airgid.com/wp-content/themes/airgid/images/logo.png) 0 18px no-repeat}#description{display:block;overflow:hidden}#sort-content{background:#1a1615;color:#999;font-size:12px;position:absolute;padding:0;top:20px;right:10px;cursor:pointer;z-index:8001}#sort-content<br />.plus{background:#FBE601 url(http://www.airgid.com/wp-content/themes/airgid/images/arrow-yellow-small.gif) center no-repeat;width:20px;float:left;padding:8px}#sort-content:hover<br />.plus{background:#000 url(http://www.airgid.com/wp-content/themes/airgid/images/arrow-black.gif) center no-repeat;width:20px;float:left;padding:8px}#sort-content<br />.label{float:right;padding:8px}#sort-content-list{position:absolute;top:20px;right:10px;background:#fbe601;width:290px;display:none;z-index:8000}#sort-content-list<br />ul{padding:0;margin:0;list-style:none}#sort-content-list<br />a{display:block;font-size:14px;text-decoration:none;padding:0px<br />10px 0 25px;line-height:32px}#sort-content-list a:hover{background:#000 url(http://www.airgid.com/wp-content/themes/airgid/images/arrow-black.gif) 5px 10px no-repeat;color:#fff}#header<br />.menu{clear:both;color:#fff;font-size:14px;margin:0<br />auto;overflow:hidden;width:100%}#header .menu<br />ul{float:left;width:100%}#header .menu<br />li{float:left;list-style-type:none}#header .menu<br />a{color:#fff;display:block;height:35px;padding:35px<br />17px 0px 17px;position:relative;text-decoration:none}#header .menu .work<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) 27px 15px no-repeat}#header .menu .work a:hover,<br />#header .menu .work.current-menu-item a,<br />#header .menu .work.current_page_item<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) 27px -48px no-repeat}#header .menu .reels<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) -45px 15px no-repeat}#header .menu .reels a:hover,<br />#header .menu .reels.current-menu-item a,<br />#header .menu .reels.current_page_item<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) -45px -48px no-repeat}#header .menu .blog<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) -120px 15px no-repeat}#header .menu .blog a:hover,<br />#header .menu .blog.current-menu-item a,<br />#header .menu .blog.current_page_item<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) -120px -48px no-repeat}#header .menu .about<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) -183px 15px no-repeat}#header .menu .about a:hover,<br />#header .menu .about.current-menu-item a,<br />#header .menu .about.current_page_item<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) -183px -48px no-repeat}#header .menu .contact<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) -248px 15px no-repeat}#header .menu .contact a:hover,<br />#header .menu .contact.current-menu-item a,<br />#header .menu .contact.current_page_item<br />a{background:url(http://www.airgid.com/wp-content/themes/airgid/images/background-nav.png) -248px -48px no-repeat}#header .menu li a:active,<br />#header .menu li a:hover,<br />#header .menu .current_page_item a,<br />#header .menu .current-menu-item<br />a{color:#fbe601}#wpadminbar li:hover ul<br />ul{left:0}<br />

 

ด้วยฟังค์ชั่น ตอบด่วน คุณสามารถใช้โค๊ดและ เครื่องหมายแสดงอารมณ์ได้ เหมือนการตั้งกระทู้ธรรมดา แต่สามารถทำได้สะดวกกว่า

ระวัง: หัวข้อนี้ไม่มีการอัพเดทมานานถึง 120 วัน

แจ้งเตือน: โพสของคุณจะไม่แสดงจนกว่าผู้ดูแลจะอนุมัติ.
ชื่อ: อีเมล์: