не скользящий не действует

0

В настоящее время я использую unlider, и он не реагирует на моем сайте. Я не совсем уверен, почему он не реагирует, потому что я настроил его как жидкость.

Код ниже:

 <script src="http://code.jquery.com/jquery-latest.min.js"></script>
  <script src="http://unslider.com/unslider.min.js"></script>
   <script>
        $(document).ready(function() {
         $('.banner').unslider({
            speed: 600,   //Speed in milliseconds
            delay: 4000, // To delay between slide (in milliseconds
            keys: true,
            fluid: true,
            dots: true 

            });
         });
 </script>

Нужно ли что-то делать в моем файле CSS или мне нужно сделать мои изображения в%

Благодарю!

Ниже приведен HTML:

<div class="banner">
    <ul =" col span_6_of_6">
        <li><img src='Images/farmimg1.jpg' width="1000" height="577" alt= "Farm Photo"></li>        
        <li><img src = "Images/tunisewefield.jpg" width="1000" height= "577" alt= "Tunis Ewe in field"></li>
        <li><img src = "Images/barnsimg.jpg"width="1000" height= "577" alt= "Wise Family Sheep Farm"></li>
        <li><img src= "Images/sheepfield.jpg" width= "1000" height = "577" alt= "Sheep in Field"></li>
    </ul>
</div>
  • 0
    У вас есть соответствующий HTML? Или вы можете создать скриптовую ссылку или разместить ссылку на сайт?
  • 0
    <div class = "banner"> <ul = "col span_6_of_6"> <li> <img src = 'Images / farmimg1.jpg' width = "1000" height = "577" alt = "Фотография фермы"> </ li > <li> <img src = "Images / tunisewefield.jpg" width = "1000" height = "577" alt = "Тунисская овца в поле"> </ li> <li> <img src = "Images / barnsimg. jpg "width =" 1000 "height =" 577 "alt =" Овцеводческая ферма мудрых семей "> </ li> <li> <img src =" Images / sheepfield.jpg "width =" 1000 "height =" 577 "alt = "Овцы в поле"> </ li> </ ul> </ div>
Показать ещё 3 комментария
Теги:

1 ответ

-1

Как говорили другие ребята, лучше всего было бы удалить ширину и высоту из встроенных изображений. Мое предложение сохранять отзывчивость изображений было бы добавлением отзывчивого класса к каждому изображению. Что-то вроде этого:

<li><img class="img-resposive" src='Images/farmimg1.jpg' alt= "Farm Photo"></li>

в то время как img-resposive будет выглядеть так:

.img-resposive{
  width: 100%;
  height: auto;
}
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню