2015-10-22 5 views
1

Я использовал тот же код ниже в Dreamweaver. В локальной среде размещения он отлично работает. Однако, если я поставлю точно такой же код на сервере Business Catalyst, он не сможет отображать изображения.Bootstrap carousel не работает на бизнес-сервере, размещенном на сайте

<!doctype html> 
<html> 
    <head> 
     <meta charset="UTF-8" /> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
     <meta name="viewport" content="width=device-width, initial-scale=1" /> 

     <!-- Latest compiled and minified CSS --> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> 

     <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
     <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> 

     <!-- Latest compiled and minified JavaScript --> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 

     <script> $(document).ready(function() { 
      $('#myCarousel').carousel({ 
      //options here 
      }); 
     }); 
     </script> 
    </head> 



    <body> 
     <div id="carousel1" class="carousel slide" data-ride="carousel"> 
       <ol class="carousel-indicators"> 
        <li data-target="#carousel1" data-slide-to="0" class="active"></li> 
        <li data-target="#carousel1" data-slide-to="1"></li> 
        <li data-target="#carousel1" data-slide-to="2"></li> 
       </ol> 
       <div class="carousel-inner" role="listbox"> 
        <div class="item active"><a href="#"><img src="image/Gold_960x560.png" alt="First slide image" class="center-block"></a> 
         <div class="carousel-caption"> 
          <h3>First slide Heading</h3> 
          <p>First slide Caption</p> 
         </div> 
        </div> 
        <div class="item"><a href="#"><img src="image/silver_960x560.png" alt="Second slide image" class="center-block"></a> 
         <div class="carousel-caption"> 
          <h3>Second slide Heading</h3> 
          <p>Second slide Caption</p> 
         </div> 
        </div> 
        <div class="item"><a href="#"><img src="image/orchid_960x560.png" alt="Third slide image" class="center-block"></a> 
         <div class="carousel-caption"> 
          <h3>Third slide Heading</h3> 
          <p>Third slide Caption</p> 
         </div> 
        </div> 
       </div> 
        <a class="left carousel-control" href="#carousel1" role="button" data-slide="prev"> 
         <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> 
         <span class="sr-only">Previous</span> 
        </a> 
        <a class="right carousel-control" href="#carousel1" role="button" data-slide="next"> 
         <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> 
         <span class="sr-only">Next</span>. 
        </a> 
       </div> 

    </body> 
</html> 
+0

В производстве ... вы уверены, что ваши пути изображения верны ... "image/Gold_960x560.png" или "../image/Gold_960x560.png" и т. Д.? – AdamJeffers

+0

И вы можете добавить pic результата? – AdamJeffers

+0

Да, я дважды проверял путь. – Tonyl

ответ

0

Я видел изображения и файлы не делают правильно в БЛ без / перед ними. Попробуйте добавить / перед вашим пути к изображению и посмотреть, визуализируются ли они. IE:

src="/image/Gold_960x560.png" 

Если они по-прежнему не отображаются, убедитесь, что они загружены на сервер, и путь верен.

Вы прокомментировали:

... для пинг, Safari просто отобразить окно с, в Chrome, альт может отображать, но не в формате PNG "?".

Вы увидите это, когда изображение не загружается.