แจกแล้วสกินพร้อมเมนู lavalamp สวยงามมมใช้ได้ทุกสกินและทุกเวอร์ชั่น [inut]

inut

จากที่หายไปนานวันนี้กลับมาพร้อมเมนูสวยๆ555 นั่งทำ1คืนเต็มๆ




ไม่มี Demo นะครับเนื่องจากหายไปนานโฮสและโดเมนได้หมดอายุไปแล้ว

ขั้นตอนการทำ

ถ้าใช้สกินนี้ก็นำไฟล์ไปวางที่ host ของเราปกติ



แต่..

ถ้าต้องการใช้กับสกินอื่น
ให้เข้าไปที่ template เข้าไฟล์ css ที่เราใช้ หรือ css ของสกินนั้นๆ


เพื่มอันนี้ลงไป

1. #menu {
   
2.     position:relative;
   
3.     z-index:100;
   
4. 
   
5. 
   
6.        
   
7. }
   
8. #menu .menu {
   
9.     position:absolute;
   
10.         padding-left:42px;
    
11.         padding-top:35px;
    
12. }
    
13. #menu * {
    
14.     list-style:none;
    
15.     border:0;
    
16.     padding:0;
    
17.     margin:0;
    
18. }
    
19. #menu a {
    
20.     display:block;
    
21.     padding:7px 14px 7px 14px;
    
22.     white-space:nowrap;
    
23.        
    
24. }
    
25. #menu li {
    
26.     float:left;
    
27.     background:#fff;
    
28. }
    
29. 
    
30. #menu div {
    
31.     visibility:hidden;
    
32.     position:absolute;
    
33.     background:url(/images/pix.gif);
    
34. }
    
35. #menu div div {
    
36.     margin:-24px 0 0 -1px;
    
37.     left:100%;
    
38. }
    
39. #menu li:hover>div { visibility:visible; }
    
40. 
    
41. /* menu::special styles */
    
42. /* menu::level 1 */
    
43. #menu a {
    
44.     text-decoration:none;
    
45.     color:#fff;
    
46.     position:relative;
    
47.     z-index:77;
    
48. }
    
49. #menu a:hover {
    
50. 
    
51.    
    
52. }
    
53. #menu a:hover span {  }
    
54. #menu>ul>li:hover>a {
    
55. 
    
56. }
    
57. #menu>ul>li:hover>a span {  }
    
58. #menu span {
    
59.      display: block;
    
60.     cursor: pointer;
    
61. 
    
62.     text-align: center;
    
63. }
    
64. #menu li { background:none; }
    
65. /* menu::level >= 2 */
    
66. #menu li li a {
    
67.     padding:0;
    
68.     position:static;
    
69. }
    
70. #menu li li a:hover { background:#888; }
    
71. #menu li li a span { color:#fff; }
    
72. #menu li li a:hover span { color:#ffffff; }
    
73. #menu li li a.parent span { background:url(/images/pointer.gif) no-repeat right 9px; _background-position:right 10px; }
    
74. *+html #menu li li a.parent span { background-position:right 10px; }
    
75. #menu li li span {
    
76.     display:block;
    
77.     text-transform:none;
    
78.     line-height:16px;
    
79.     padding:4px 25px 4px 14px;
    
80.     font-size:11px;
    
81. }
    
82. #menu li div { background:url(/images/back.png);opacity:0.4;
    
83. filter:alpha(opacity=40); }
    
84. /** <fix for ie6> */
    
85. #menu div div {
    
86.     _margin-top:-25px;
    
87.     _background:#c4c4c4;opacity:0.4;
    
88. filter:alpha(opacity=40);
    
89. }
    
90. 
    
91. /** </fix for ie6> */
    
92. 
    
93. /* lava lamp */
    
94. div#menu li.back {
    
95.     width:10px;
    
96.     height:50px;
    
97.     z-index:8;
    
98.     position:absolute;
    
99. }
    
100. div#menu li.back .left {
     
101.     width:auto;
     
102.     height:50px;
     
103.     float:none;
     
104.     position:relative;
     
105.     top:0;
     
106.     left:0;
     
107.     visibility:visible;
     
108. }

คัดลอกไปที่คลิปบอร์ด

แล้วเข้าไปที่ไฟล์ header.php

1. <script type="text/javascript" src="jquery.js"></script>
   
2. <script>var a = jQuery.noConflict();</script>
   
3. <script type="text/javascript" src="menu.js"></script>
   
4. <script>var b = jQuery.noConflict();</script>
   
5. <script type="text/javascript" src="fontsmoothie.min.js" async></script>

คัดลอกไปที่คลิปบอร์ด

ใส่ไปตามรูปเลยหรือที่ว่างๆ เพื่อเรียกไฟล์ javascript

แล้วมองหา

1. <!--{loop $_G['setting']['navs'] $nav}-->
   
2.                                                         <!--{if $nav['available'] && (!$nav['level'] || ($nav['level'] == 1 && $_G['uid']) || ($nav['level'] == 2 && $_G['adminid'] > 0) || ($nav['level'] == 3 && $_G['adminid'] == 1))}--><li {if $mnid == $nav[navid]}class="a" {/if}$nav[nav]></li><!--{/if}-->
   
3.                                                 <!--{/loop}-->

คัดลอกไปที่คลิปบอร์ด

เหลือไว้แค่นี้แล้วใส่โค๊ดเลย

1. <div id="menu">
   
2.     <ul class="menu">
   
3.         
   
4.                   
   
5.                                                 <!--{loop $_G['setting']['navs'] $nav}-->
   
6.                                                         <!--{if $nav['available'] && (!$nav['level'] || ($nav['level'] == 1 && $_G['uid']) || ($nav['level'] == 2 && $_G['adminid'] > 0) || ($nav['level'] == 3 && $_G['adminid'] == 1))}--><li {if $mnid == $nav[navid]}class="a" {/if}$nav[nav]></li><!--{/if}-->
   
7.                                                 <!--{/loop}-->
   
8.                                         </ul>
   
9.         
   
10.         
    
11.         
    
12.    
    
13. </div>
    
14. 
    
15.        
    
16. </ul>

คัดลอกไปที่คลิปบอร์ด

เสร็จเรียบร้อยยยย..


มีข้อสงสัยถามได้นะครับ ผมแนะนำไลน์นะครับเพราะไม่ค่อยได้เข้ามาา id. inut..
ยังเหมือนเดิมนะครับรับสอนให้ได้ ฟรีก็ได้ ใครจะปรึกษาเรื่องโมสกินได้หมดครับเกี่ยวกับดิสคัสฟรีไม่คิดเงินนะ รับโมสกินด้วยใครสนใจก็แอดมานะครับบบ
ถ้าไม่มีไลน์ก็ PM มาครับช่วงนี้เข้าตลอด

PASS.   i n u t i n u t i n u t ติดกันนะครับ

inut

ผมลืมบอกสกินไหนที่ใช้ Div id class ว่า menu มันจะซ้ำกันนะครับให้เปลี่ยนด้วยมิเช่นนั้นมันจะรวนและมั่วไปหมด
ด้วยความหวังดีครับบ inut.

suttasilo

ขอบคุณที่แบ่งปัน