• 售前

  • 售后

热门帖子
入门百科

Discuz! X3.4默认模板自适应手机与pc的方法

[复制链接]
丁侦球 显示全部楼层 发表于 2021-8-14 14:38:38 |阅读模式 打印 上一主题 下一主题
个人感觉PC这个主题体现在手机里更美观。同时本身又不想装一堆第三方主题,这个刚好

代码如下:
  1. <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.slim.min.js"></script>
  2. <script>var jq = jQuery.noConflict();</script>
  3. <script>
  4. jq(document).ready(function () {
  5. jq("head").append('<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">')
  6. jq("head").append('</p>
  7. <style>.tedt{width:100% !important; max-width:600px}</style>
  8. <p>')
  9. jq("head").append('</p>
  10. <style>.quote{width:100% !important}</style>
  11. <p>')
  12. jq("#toptb").css("min-width", "0")
  13. jq(".hdc.cl").css("min-height", "0")
  14. jq(".wp").css("min-width", "0")
  15. jq(".zoom").css("width", "100%")
  16. jq(".zoom").css("max-width", "600px")
  17. jq(".attach_nopermission.attach_tips").css("width", "100%")
  18. jq(".attach_nopermission.attach_tips").css("max-width", "600px")
  19. jq(".tedt.mtn").css("width", "100%")
  20. jq(".tedt.mtn").css("max-width", "600px")
  21. jq("#scrolltop").children("span:eq(0)").children("a").attr("onclick", "void(0)")
  22. resized()
  23. })
  24. window.addEventListener("resize", resized)
  25. function resized() {
  26. if (jq(document).width() <= 650) {
  27. jq("#online").hide()
  28. jq("#qmenu").hide()
  29. jq("#um").children("p:eq(1)").hide()
  30. jq("#um").css("padding-right", "0")
  31. jq("#scbar_txt").css("width", "calc(100vw - 145px)")
  32. jq(".scbar_hot_td").hide()
  33. jq(".fl_i").hide()
  34. jq(".fl_by").hide()
  35. jq(".hdc.cl").children("h2").children("a").children("img").css("height", "32px")
  36. jq("#chart").hide()
  37. jq("#loginstatus").hide()
  38. jq(".avt.y").hide()
  39. jq(".y.pns").children("table").children("tbody").children("tr:eq(0)").hide()
  40. jq(".y.pns").children("table").children("tbody").children("tr:eq(1)").children("td:eq(0)").hide()
  41. jq(".y.pns").children("table").children("tbody").children("tr:eq(1)").children("td:eq(1)").hide()
  42. jq("#frt").hide()
  43. jq(".by").hide()
  44. jq(".num").hide()
  45. jq(".bm_h.cl").children(".y").hide()
  46. jq("#toptb").children(".wp").children(".y").hide()
  47. jq(".pls").hide()
  48. jq("#fj").hide()
  49. jq("#fastsmiliesdiv").hide()
  50. jq("#fastposteditor").css("margin-right", "0")
  51. jq("#p_btn").hide()
  52. } else {
  53. jq("#online").show()
  54. jq("#qmenu").show()
  55. jq("#um").children("p:eq(1)").show()
  56. jq("#um").css("padding-right", "60px")
  57. jq("#scbar_txt").css("width", "400px")
  58. jq(".scbar_hot_td").show()
  59. jq(".fl_i").show()
  60. jq(".fl_by").show()
  61. jq(".hdc.cl").children("h2").children("a").children("img").css("height", "66px")
  62. jq(".pipe").show()
  63. jq("#chart").show()
  64. jq("#loginstatus").show()
  65. jq(".avt.y").show()
  66. jq(".y.pns").children("table").children("tbody").children("tr:eq(0)").show()
  67. jq(".y.pns").children("table").children("tbody").children("tr:eq(1)").children("td:eq(0)").show()
  68. jq(".y.pns").children("table").children("tbody").children("tr:eq(1)").children("td:eq(1)").show()
  69. jq("#frt").show()
  70. jq(".by").show()
  71. jq(".num").show()
  72. jq(".bm_h.cl").children(".y").show()
  73. jq("#toptb").children(".wp").children(".y").show()
  74. jq(".pls").show()
  75. jq("#fj").show()
  76. jq("#fastsmiliesdiv").show()
  77. jq("#fastposteditor").css("margin-right", "170px")
  78. jq("#p_btn").show()
  79. }
  80. }
  81. </script>
复制代码
利用方法:将以下代码放入配景统计即可
我去,帖子内容不能放js代码,我只好放我论坛帖子链接了,版主包涵,放了js代码提示帖子有伤害,发不了
https://discuzx.qvdd.cn/thread-3-1-1.html
大家可以顺便用手机的尺寸体验一下这个网页
yomkk大佬:
感觉比默认的触屏版要好用
zgs大佬:
这是改了改比例吗
看着好mini
programer大佬:
  1. 这是改了改比例吗
  2. 看着好mini
复制代码
字体大小没改,图片和边框改成自适应,在手机上看挺舒服的
programer大佬:
感觉比默认的触屏版要好用
是啊,看着很亲切。触屏版谁人感觉是10年前的手机网页。。
micto大佬:
楼主你的思路好,但是建议换方式来实现,不要用JS。
另外meta标签不要用JS,直接写在模板里,或者设置到配景设置里。
其他的部分用CSS来实现。
出错大叔大佬:
现在还能做论坛吗

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

帖子地址: 

回复

使用道具 举报

分享
推广
火星云矿 | 预约S19Pro,享500抵1000!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

草根技术分享(草根吧)是全球知名中文IT技术交流平台,创建于2021年,包含原创博客、精品问答、职业培训、技术社区、资源下载等产品服务,提供原创、优质、完整内容的专业IT技术开发社区。
  • 官方手机版

  • 微信公众号

  • 商务合作