背景图像存在但不可见答案

【问题标题】：Background image present but not visible背景图像存在但不可见
【发布时间】：2016-07-28 10:38:04
【问题描述】：

在以下网站http://haircolourideas.eu/#section2 我在服务部分有一个 ul，而 li 有背景图片。 li 有 service1 、 service2 等类。背景图像突然变得不可见。如果我检查元素 css 是正确的，它表明图像存在。该网站已经上线了几个月，而我没有改变任何事情，这就是今天发生的事情

<ul id="services-list" class="hidden">
    <li class="service1 service-img"><label class="btn" for="modal-1"><h3>meche</h3></label></li>
    <li class="service2 service-img"><label class="btn" for="modal-2"><h3>tinting</h3></label></li>
    <li class="service3 service-img"><label class="btn" for="modal-3"><h3>fashion</h3></label></li>
    <li class="service4 service-img"><label class="btn" for="modal-4"><h3>change</h3></label></li>
</ul>

.service1 {
    background: url(../img/meche1.png);
    cursor: pointer;
}

.service2 {
    background: url(../img/tint1.png);
    cursor: pointer;
}

.service3 {
    background: url(../img/fashion1.png);
    cursor: pointer;
}

.service4 {
    background: url(../img/change1.png);
    cursor: pointer;
}

【问题讨论】：

我不确定，但似乎你有一个 class="hidden" ？

标签： html css image url

【解决方案1】：

从节点中移除隐藏的类：

<div id="services-info" class="hidden">
<ul id="services-list" class="hidden">

【讨论】：

【解决方案2】：

<ul id="services-list" class="hidden">
<li class="service1 service-img"><label class="btn" for="modal-1"><h3>meche</h3></label></li>
<li class="service2 service-img"><label class="btn" for="modal-2"><h3>tinting</h3></label></li>
<li class="service3 service-img"><label class="btn" for="modal-3"><h3>fashion</h3></label></li>
<li class="service4 service-img"><label class="btn" for="modal-4"><h3>change</h3></label></li>

从您的ul 中删除class="hidden"

【讨论】：

【解决方案3】：

问题在于动画不起作用，因为在ul 中有class="hidden"，这使得opacity: 0 隐藏了所有ul 部分。应用 class="hidden" 是因为您的服务器 jquery.viewportchecker.js 中缺少此脚本。如果您使用检查元素打开控制台，您会看到错误。该脚本根据您所在的部分使隐藏的类应用或不应用。正如您在链接中看到的那样，脚本以某种方式从您的服务器中删除：http://haircolourideas.eu/js/jquery.viewportchecker.js 所以您必须将其放回原处，并且还会出现此 jquery 错误： “未捕获的 TypeError：jQuery(...).addClass(...).viewportChecker 不是函数” 在您的控制台中将消失，网站将像以前一样运行

【讨论】：

我对此有点陌生，所以只是想知道一个 jquery 文件是如何从服务器中删除的？
我不知道该说什么，但您可以通过输入主机 cpanel 对您的网络进行更改并意外删除它，或者您进行了备份和恢复并在此过程中丢失了过程。您是否对您的网站进行了任何更改或更改了主机？
不，我所做的只是更新我的 css 文件夹，该文件夹离我的 js 文件夹不远，但无论哪种方式，我都知道如果遇到问题，我应该检查服务器上的各种文件夹
是的，问题可能出在任何地方，更具体地说，您应该检查有关您的特定服务器的信息。

【解决方案4】：

你可以试试这个：我可以说一定要展示你的形象。

.hidden {
    /* opacity: 0; */
}

如果不需要则删除opacity:0属性，否则设置不透明度：1；

否则你可以从 ul 中移除 hidden 类

【讨论】：

【解决方案5】：

只需删除类隐藏手段

<ul id="services-list" class="hidden"> not visible
<ul id="services-list" class=""> visible

【讨论】：