可可的可 发表于 2024-9-9 14:57:41

修改系统内置的DIY幻灯片样式。大家看看和原来的哪个好看。

https://www.dismall.com/data/attachment/forum/202401/27/154126ss8aa6i2rh2hqqqa.png

局部效果。



整体效果

修改如下:
1、upload/static/js/common_extra.js
此文件主要是修改幻灯片的编号位置。
搜索并修改如下:
if(!this.slidebar) {                if(!this.slidenum && !this.slidestep) {                        this.container.parentNode.style.position = 'relative';                        this.slidebar = document.createElement('div');                        this.slidebar.className = 'slidebar';                        this.slidebar.style.position = 'absolute';                        this.slidebar.style.bottom = '4px'; /*原文件是:this.slidebar.style.top = '5px'; */2、upload/template/default/common/common.css
这里是修改这边标题的样式。
搜索并修改如下: (注:这里修改的内容比较杂乱,忘了之前的代码是什么了。你们就直接复制这个代码得了。)

/* 幻灯片 */.slideblock { position: relative; }/* 标题内容 */      .slideshow { clear: both; }                .slideshow li { position: relative; overflow: hidden; }                        .slideshow span.title { position: absolute; bottom: 0; left: 0;right:0; margin-bottom: 0; width: 100%; height: 32px; line-height: 32px; text-align:right;font-size: 14px; text-indent: 14px; border-radius:6px;}                        .slideshow span.title, .slidebar li { background: rgba(0, 0, 0, 0.3); color: {LIGHTLINK}; overflow: hidden; }                        /* 编号 */                        .slidebar li { float: left; margin-right: 2px; width: 24px; height: 24px; line-height: 24px; text-align: center; font-size: 14px; cursor: pointer;border-radius:6px; }                              .slidebar li.on { background: rgba(255, 255, 255, 0.5); color: #000; font-weight: 700; }


至此修改完毕,登录后台,更新一下缓存即可。

余赚网 发表于 2024-9-9 14:58:26

用户不能编辑自己发的帖子啊。

IT618应用中心 发表于 2024-9-9 14:59:13

我这试了下,幻灯片还是直角的,没有你这个圆角

ysx24 发表于 2024-9-9 15:00:06

圆角自己加个样式就好了啊,如:border-radius: 20px; 这都懒得加吗

yusr 发表于 2024-9-9 15:01:02

是不乍会呢,我现在把DIY的图片都整成圆角了,但是统一的,没有一个一个的调,DIY的图片真不知是哪个样式,直接在DIY代码里加的。就这样了,比静态好些。

小冰 发表于 2024-9-9 15:02:01

你这个不错 比较漂亮

霸王别姬 发表于 2024-9-9 15:02:28

我基本不用DIY,大多是创建后台模块,然后调用
页: [1]
查看完整版本: 修改系统内置的DIY幻灯片样式。大家看看和原来的哪个好看。