เปลี่ยนจาก 3ขีด มาเป็นคำว่า MENU เลยครับ
เปลี่ยนในไฟล์สคริป ตัวไหนครับ แนะนำหน่อยครับ
มันแล้วแต่ธีมครับบอกยากว่าจะปรับยังไง แต่ส่วนใหญ่แก้ได้ที่ css หลักนั่นแหละครับ มองหา #nav-toggle ครับ ว่าธีมที่ใช้เขียนยังไง ถ้า color: transparent; ไว้ ก็ให้เราใส่สีเข้าไปครับ แล้วก็ไปดูภายใน a href ว่ามีการใช้ ag <span></span> ไหม เพราะพวกนี้จะทำขีดสามขีดมาจาก tag :before และ :after ให้เราดิสเพลย noneที่แทกspan เลย #nav-toggle span{display:none}
แล้วก็ลองๆเช็คดูหลายๆขนาดหน้าจอครับ เบื้อต้นก็ประมาณนี้ครับ
อ่านละงง ครับ ผมไม่เข้าใจ
.vl-main-navigation a{
color: #0E0E0E;
}
.vl-toggle-menu{
display: block;
float: right;
height: 54px;
width: 54px;
cursor: pointer;
}
.vl-toggle-menu span{
position: relative;
background: #FFF;
height: 2px;
width: 32px;
margin: 0 auto;
display: block;
top: 50%;
margin-top: -1px;
box-shadow: 0 10px 0px 0px #FFF, 0 -10px 0px 0px #FFF;
}
.vl-main-navigation a{
text-shadow: none;
}
ใน css ของผมเป็นตามนี้ ต้องแก้ไขไงอ่ะครับ
แก้แบบนี้
ในส่วน html เพิ่มคำว่า MENU เข้าไปใน tag <span></span> เพราะอันเดิมเค้าทำขีดจากการใช้ shadow สีขาว
<div class="vl-toggle-menu"><span>MENU</span></div>
แล้วตรง css ปรับที่ .vl-toggle-menu span เป็นแบบนี้
.vl-toggle-menu span{position: relative;margin: 0 auto;display: block;font-size:0.9em;text-align:center;line-height:1.1em;padding:5px; }
ประมาณนี้
พัฒนาเว็บไซต์
