第一天-解决了轮播图片不能显示和部分文件不能下载两个问题

sae,与普通的空间不同,在sae中搭建的网站的上传文件只能存放在storage中,这个给网站搬到sae中造成了很大的麻烦。原来的文件都是采用相对路径的

第一个问题:轮播图片不能显示

有两个解决的方法:

第一个方法:将原来所有的src属性值改为绝对路径。如果你的图片不多,这个方法的效率挺高的。唯一的不足之处就是你需要去寻找src的属性值,如果代码很多,恭喜你!

第二个方法:修改源码。这是一个很重大的工程,首先需要找到对应的源码,说实话,我的80%的时间花在找源码上。因为之前的网站得到的图片的路径都是相对路径,所以在源码中将相对路径改为绝对路径就行了,但是原来的源码是使用is_file函数去判断的,这个对于判断用绝对路径表示的图片不适用,所以改用判断http状态码判断。有好几个方法。详细信息请看:我用了最简单的方法。

第二个问题:部分文件不能下载

有两个解决的方法:

第一个方法:将原来文件的路径改为绝对路径。如果你的文件不多,这个方法还是挺好的。

第二个方法:修改源码。找对应的源码,找到我想哭。修改的方法也是改用判断http状态码判断。


总结:

今天的评价是效率十分低。我最大问题就是:不知道doccms是如何运作的。它的源码代码分布很混乱,函数的调用漫天飞,我有时找一个函数需要花费十几分钟。可能是因为我自己的水平较低。好想有个前辈给我说说doccms的运行机制。希望明天能梳理出它的运行机制。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,我可以为您提供一个简单的实现轮图并且能左右点击翻页的 JavaScript 代码: HTML 部分: ```html <div class="slider-container"> <div class="slider-wrapper"> <div class="slider-slide">Slide 1</div> <div class="slider-slide">Slide 2</div> <div class="slider-slide">Slide 3</div> </div> <a href="#" class="slider-prev">Prev</a> <a href="#" class="slider-next">Next</a> </div> ``` CSS 部分: ```css .slider-container { position: relative; overflow: hidden; } .slider-wrapper { display: flex; transition: transform 0.3s ease-in-out; } .slider-slide { flex: 0 0 100%; } .slider-prev, .slider-next { position: absolute; top: 50%; transform: translateY(-50%); } .slider-prev { left: 0; } .slider-next { right: 0; } ``` JavaScript 部分: ```javascript const sliderWrapper = document.querySelector('.slider-wrapper'); const sliderSlides = document.querySelectorAll('.slider-slide'); const sliderPrevBtn = document.querySelector('.slider-prev'); const sliderNextBtn = document.querySelector('.slider-next'); const slideWidth = sliderSlides[0].clientWidth; let slideIndex = 0; sliderPrevBtn.addEventListener('click', () => { slideIndex -= 1; if (slideIndex < 0) { slideIndex = sliderSlides.length - 1; } sliderWrapper.style.transform = `translateX(-${slideIndex * slideWidth}px)`; }); sliderNextBtn.addEventListener('click', () => { slideIndex += 1; if (slideIndex >= sliderSlides.length) { slideIndex = 0; } sliderWrapper.style.transform = `translateX(-${slideIndex * slideWidth}px)`; }); ``` 这段代码中,我们定义了一个 slider-container 容器,用于包含轮图的内容。其中,slider-wrapper 是轮图的容器,slider-slide 是轮图的每一项内容。通过设置 slider-wrapper 的 transform 属性来实现轮图的滚动效果。 我们还定义了两个按钮,分别是 slider-prev 和 slider-next,用于向前和向后滚动轮图。通过修改 slideIndex 变量来记录当前显示的轮图的索引,并根据 slideIndex 和 slideWidth 的值来计算 slider-wrapper 的 transform 属性值,从而实现轮图的翻页效果。 希望这个代码可以帮到您。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值