กรุณาปิด โปรแกรมบล๊อกโฆษณา เพราะเราอยู่ได้ด้วยโฆษณาที่ท่านเห็น
Please close the adblock program. Because we can live with the ads you see


Mobile logo header

วิธีการทํา Mobile logo header

  • ผู้เริ่มหัวข้อ ผู้เริ่มหัวข้อ thxf.org 
  • วันที่เริ่มต้น วันที่เริ่มต้น

thxf.org 

Administrator
สมาชิกทีมงาน
Admin
เจ้าของกระทู้
Would you like to have a mobile header with logo like this?

cxf_mobile_logo_demo-gif.gif



As you can see you can have a mobile header, but when you scroll the logo will show in the navigation.

To achieve this add code below to extra.less template:

Less:
/* [cXF] Mobile logo header */
@media (max-width: @xf-responsiveMedium) {
.has-js .p-header {
display: initial;
}
.p-header-logo {
max-width: 100%;
margin: 0 auto;
}
.p-header-logo.p-header-logo--image img {
max-height: 80px;
}
.has-js .p-nav-smallLogo {
opacity: 0;
transition: all .25s ease;
}
.p-navSticky.is-sticky .p-nav-smallLogo {
opacity: 1;
transition: all .25s ease;
}
/* to hide icons in header if you're using [cXF] Icons in Header add-on */
.cxf_icons_header_container {
display: none;
}
}
/*****/

 

ไฟล์แนบ

  • cxf_mobile_logo_demo-gif.webp
    cxf_mobile_logo_demo-gif.webp
    322.3 กิโลไบต์ · จำนวนการดู: 320


กระทู้ที่คล้ายกัน

thxf.org ได้ส่งไฟล์ใหม่: [XenGenTr] Editor Logo [English] - This plugin allows you to add your site's logo to the editor. [XenGenTr] Editor logo This plugin allows you to add your site's logo to...
ตอบกลับ
0
จำนวนการดู
447
วิธีการทํา ทำโลโก้เขย่า logo shake
ทำโลโก้เขย่า logo shake ทำง่ายดังนี้ครับ ไปที่ extra.less แล้วเพิ่มโค๊ดด้านล่างเข้าไป แล้วบันทึกจะได้แบบ thxf.org เลยครับ ปล.สั่นช้าเร็วแก้ที่ 4.72s เลยครับ
ตอบกลับ
0
จำนวนการดู
767
  • ปักหมุด
  • บทความ บทความ
With the exciting release of vBulletin 6 on the way, vBulletin 5 Connect and vBulletin Mobile Suite will begin the sunsetting process. Please see below for important End of Life details for these...
ตอบกลับ
0
จำนวนการดู
471
  • บทความ บทความ
vBulletin Mobile Suite 2.10 Changes Mobile Suite 2.10 is available to be built via the Mobile Publisher. Mobile Suite 2.10 is predominantly a bug-fix release. Resolved Issues Increase Android...
ตอบกลับ
0
จำนวนการดู
412
  • บทความ บทความ
Mobile Suite 2.9 is available to be built via the Mobile Publisher. Mobile Suite 2.9 is predominantly a bug-fix release. The google admob library was updated which now requires the Ad App ID to be...
ตอบกลับ
0
จำนวนการดู
616

กรุณาปิด โปรแกรมบล๊อกโฆษณา เพราะเราอยู่ได้ด้วยโฆษณาที่ท่านเห็น
Please close the adblock program. Because we can live with the ads you see
กลับ
ยอดนิยม ด้านล่าง