開啟輔助瀏覽

Besv 技術討論區

 找回密碼
 立即註冊
搜尋
查看: 1271|回覆: 0

論壇功能改進:切換寬/窄圖片變形問題

[複製連結]
發表於 2016-7-28 17:04:29 | 顯示全部樓層 |閱讀模式
之前看到了2013年的一篇文章...(在這裡
https://daxingplay.me/study/css/a-nav-with-auto-width.html)
裡面提到了能夠將導航欄的位置切換問題修正,但卻只用於x1.5
不知是否能夠運用在x3.2首頁的圖片輪播上?
首頁的圖片輪播寬窄切換後:




後來,終於想出解決方案:
寬版和窄版的區別在於它加載一個額外的css文件widthauto.css,所以我們可以在template/default/common/widthauto.css加入控製圖片幻燈模板裡元素長度的風格:
  1. ul.slideshow > li, ul.slideshow > li > a > img {
  2.     width: 100% !important;
  3. }
複製代碼

更新緩存後應該可以達到需要的效果,如果不完全滿意的話,試試微調其中的百分比

現在圖片區的問題解決了,不過,還有一個問題,DIY按鈕會與導航欄衝突:
當使用窄版時,DIY的設置按鈕不會與導航欄衝突,但是當我切換置寬版時,因為導航欄被放大至右邊,導致與DIY的設置按鈕衝突,不知是否能夠將DIY的按鈕移置左邊?我找了模版的CSS文件,卻沒找到空置DIY按鈕位置的代碼,倒是在開發人員控制台下,找到控制的代碼,但是不知道在哪個文件裡面
窄:

寬:

找到的控制代碼,調整top中的數值及可調整按鈕位置:

DIY按鈕元素定義在 template/default/common/header_diynav.htm裡,它的風格定義在 template/default/common/common.css 裡,
將top 0改成top 40即可

Finish!!!

您需要登入後才可以回文 登入 | 立即註冊

本版積分規則

黑名單|客戶連結|客服信箱|客服系統

Copyright © 2013 - 2019 Besv Technology Forum

專業網站主機服務

Powered by Discuz!

Wildcard SSL Certificates

快速回覆 返回頂部 返回列表