2017-10-07 56 views
0

当我上传到托管网站,但我的电脑是 功能我的传送带不工作。像,它会自动移动到下一张幻灯片。我正在尝试另一种可能的解决方案,但是当我上传到托管站点时,它不能很好地工作 对此有何建议?代码不工作时,上传到托管网站

以下是我的site的链接。 我希望你能理解我的意思,对不起我的英文不好。 谢谢!

#banner{ 
 
} 
 
#banner img{ 
 
    max-width: 100%; /* para magin responsive xa */  
 
} 
 
#banner .carousel-indicators { 
 
    bottom: 20px; 
 
} 
 
/* No need individual color class unless you need it multiple times */ 
 
#banner{ 
 
    color: #000; /* Black */ 
 
    text-transform: uppercase; 
 
    text-shadow: 1px 1px 1px rgba(0,0,0,.7); 
 
} 
 
#banner .item{ 
 
    background: #dfad70; 
 
    padding: 50px 0 70px;  
 
} 
 
#banner .item:nth-child(1){ 
 
    background: #8AC9ED; 
 
} 
 
#banner .item:nth-child(2){ 
 
    background: #A3DAD3; 
 
} 
 
#banner .item:nth-child(3){ 
 
    background: #BF9CCB; 
 
} 
 
#banner .item:nth-child(4){ 
 
    background: #dfad70; 
 
} 
 

 
#banner h1{ 
 
    color: #fff; /* White */ 
 
} 
 
#banner ul{ 
 
    margin: 0; 
 
    padding-left: 20px;  
 
} 
 
.carousel-inner ul{ 
 
    list-style: none; 
 
} 
 
.carousel-inner li:before { 
 
    font-family: FontAwesome; 
 
    content: "\f00c"; 
 
    padding-right: 20px; 
 
} 
 
#banner .section-1{ 
 
    font-family: buenard; 
 
    font-size: 3em; 
 
} 
 
#banner .section-2{ 
 
    font-family: buenard; 
 
    font-size: 1.5em; 
 
} 
 

 
@media (max-width: 768px) { 
 
    #banner .item, 
 
    #banner .item .text-right{ 
 
    text-align: center; 
 
    } 
 

 
    #banner ul{ 
 
    max-width: 400px; 
 
    margin: 0 auto; 
 
    text-align: left; 
 
    } 
 
    #banner .item{ 
 
    min-height: auto; 
 
    } 
 
}
<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
    <title>GOOD HEART</title> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <link rel="shortcut icon" href="https://i.imgur.com/pLO28P8.png" /> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css"> 
 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> 
 
    <link rel="stylesheet" type="text/css" href="css/carousel.css"> 
 
</head> 
 

 
<body> 
 
    <div id="banner"> 
 
     <div id="carousel-example" class="carousel slide" data-ride="carousel"> 
 
      <ol class="carousel-indicators"> 
 
       <li data-target="#carousel-example" data-slide-to="0" class="active"></li> 
 
       <li data-target="#carousel-example" data-slide-to="1"></li> 
 
       <li data-target="#carousel-example" data-slide-to="2"></li> 
 
       <li data-target="#carousel-example" data-slide-to="3"></li> 
 
      </ol> 
 
      <div class="carousel-inner"> 
 
       <div class="item active"> 
 
        <div class="row"> 
 
         <div class="col-sm-5 text-right"><img src="https://placeimg.com/300/250/any" /></div> 
 
         <div class="col-sm-7"> 
 
          <h1 class="animated fadeInUpBig section-1">ABOUT</h1> 
 
          <h3 class="animated fadeInUpBig slide-delay-2 section-2"> 
 
           Makes quality cones and provide service like partners. 
 
           </h3> 
 
         </div> 
 
        </div> 
 
        <!-- end .row --> 
 
       </div> 
 
       <!-- end .item --> 
 
       <div class="item"> 
 
        <div class="row"> 
 
         <div class="col-sm-5 text-right"><img src="https://placeimg.com/300/250/any" /></div> 
 
         <div class="col-sm-7"> 
 
          <h1 class="animated bounce section-1">Products</h1> 
 
          <ul class="animated fadeInUpBig slide-delay-2 section-2"> 
 
           <li>Wafer Cones</li> 
 
           <li>Sugar conesipsum dolor sit amet</li> 
 
           <li>Bakery Products</li> 
 
          </ul> 
 
         </div> 
 
        </div> 
 
        <!-- end .row --> 
 
       </div> 
 
       <!-- end .item --> 
 
       <div class="item"> 
 
        <div class="row"> 
 
         <div class="col-sm-5 text-right"><img src="https://placeimg.com/300/250/any" alt="" /></div> 
 
         <div class="col-sm-7"> 
 
          <h1 class="animated fadeInDownBig section-2">Recognized Religious Halal Certification and Accreditation Authority</h1> 
 
         </div> 
 
        </div> 
 
        <!-- end .row --> 
 
       </div> 
 
       <!-- end .item --> 
 
       <div class="item"> 
 
        <div class="row"> 
 
         <div class="col-sm-5 text-right"><img src="https://placeimg.com/300/250/any" /></div> 
 
         <div class="col-sm-7"> 
 
          <h1 class="animated bounce section-1">System Certification</h1> 
 
          <ul class="animated fadeInUpBig slide-delay-2 section-2"> 
 
           <li>HACCP CODEX ALIMENTARIUS</li> 
 
           <li>GOOD MANUFACTURING PRACTICE</li> 
 
           <li>FOOD SAFETY SYSTEM CERTIFICATION 22000</li> 
 
          </ul> 
 
         </div> 
 
        </div> 
 
        <!-- end .row --> 
 
       </div> 
 
       <!-- end .item --> 
 
      </div> 
 
      <!-- end .carousel-inner --> 
 
     </div> 
 
     <!--// end .carousel --> 
 
    </div> 
 
    <!-- end #banner --> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
</body> 
 
</html>

回答

0

您的代码不会在您的网站,因为这条线HTTPS

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

您的网络是主机是安全的香奈儿的运行,所以每个源也有来自安全香奈儿。如果您的网站并打开控制台日志选项卡中打开检查(按F12),你会看到一个消息

混合内容:在页面“https://kkeennyy-tan.github.io/index.html”装载了HTTPS,但要求一个不安全的样式表“http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css” 。此请求已被阻止;内容必须通过HTTPS提供。

所以要解决,你只需要改变的“http://”问题为“https://”

+0

谢谢@vtc我已经改变了所有HTTP HTT在JS链接的CSS – KennyTan

1

您的网站是HTTPS,但你引用外部资产如HTTP,这创造了一个安全问题。你没有问题在你的本地网络服务器上,因为你通过http访问它。

始终只//

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

通过

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

开始对外资产URL如果对外资产可以用HTTPS,始终使用https://

总是在开发工具(F11)中检查控制台,您经常可以看到自己的错误。

+0

意思,我会删除所有的https:在我的CSS链接? 是这样的? https://imgur.com/a/82vTy – KennyTan

+0

它的协议相对URL意味着该页面将尝试使用自己的协议加载外部引用。最佳做法是在可能的情况下始终通过https加载。 – RafH

+0

感谢他的工作!...我已经把HTTPS放在每一个CSS和JS,现在它的工作 – KennyTan