Форум

kbn · #1 (**permalink**) 17.12.2014, 22:07

Прописал два слайдера bxslider. В каждом сладере по три картинки. После добавления функции randomStart: "true" он стал отображать картинки в случайном порядке, как и задумывалось, но и сами слайдеры отображаются теперь на сайте то по одному, то по два, а нужно чтобы постоянно было два. Вот код:
<?php

echo '<div id="reklama_right" width="240" height="1200">

<div id="slider_1" class="bxslider">

<div><a href="http://" target="_blank"><img src="../kbn_4/slider/images/1.jpg" alt="kbn" width="240" height="240"/></a></div>
<div><a href="http://" target="_blank"><img src="../kbn_4/slider/images/2.jpg" alt="kbn" width="240" height="240"/></a></div>
<div><a href="http://" target="_blank"><img src="../kbn_4/slider/images/3.jpg" alt="kbn" width="240" height="240"/></a></div>

</div>

<div id="slider_2" class="bxslider">

<div><a href="http://" target="_blank"><img src="../kbn_4/slider/images/1.jpg" alt="kbn" width="240" height="240"/></a></div>
<div><a href="http://" target="_blank"><img src="../kbn_4/slider/images/2.jpg" alt="kbn" width="240" height="240"/></a></div>
<div><a href="http://" target="_blank"><img src="../kbn_4/slider/images/3.jpg" alt="kbn" width="240" height="240"/></a></div>

</div>

<script type="text/javascript">

$(document).ready(function(){

$("#slider_1").bxSlider({
auto: "true",
mode: "fade",
speed: "500",
wrapperClass: "bx-wrapper",
autoHover: "true",
randomStart: "true",
pause: "3000"
});

$("#slider_2").bxSlider({
auto: "true",
mode: "fade",
speed: "500",
wrapperClass: "bx-wrapper",
autoHover: "true",
randomStart: "true",
pause: "3000"
});

});

</script>

</div>'

?>

рони · #2 (**permalink**) 17.12.2014, 23:25

Сообщение от kbn

auto: "true",

зачем кавычки?
Пожалуйста, отформатируйте свой код!
Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[js]
... ваш код...
[/js]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

kbn · #3 (**permalink**) 18.12.2014, 03:11

Ковычки я прописал правильно! Я уверен, что есть какое то условие, которое задаёт порядок в моём косяке!

рони · #4 (**permalink**) 18.12.2014, 10:21

Сообщение от kbn

Я уверен,

Цитата:

randomStart

Start slider on a random slide
default: false
options: boolean (true / false)

http://bxslider.com/options

но в вашем случае и с кавычками сработает -- смотрите вашу разметку и другие скрипты , а данный скрипт тут не причём.

Сообщение от kbn

рони · #5 (**permalink**) 18.12.2014, 10:57

похоже вы несколько раз запускаите инициализацию слайдера на одном и том же элементе тогда будут глюки.

kbn · #6 (**permalink**) 18.12.2014, 12:41

так и как надо прописать в итоге?

рони · #7 (**permalink**) 18.12.2014, 13:15

kbn, больше инициализаций ненужно

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script src="http://bxslider.com/lib/jquery.bxslider.js"></script>
  <link rel="stylesheet" type="text/css" href="http://bxslider.com/css/styles.css">
  <link rel="stylesheet" type="text/css" href="http://bxslider.com/lib/jquery.bxslider.css">
  <style type="text/css">
  .bxslider {
   width: 100%;
  }
#reklama_right     {
    width:240px; height:1200px;
    padding: 5px;
    }
</style>

  <script>
  $(function () {
 $('.bxslider').bxSlider({
 auto: true,
 mode: "fade",
 speed: 500,
 wrapperClass: "bx-wrapper",
 autoHover: true,
 randomStart: true,
 pause: 3000
});
  })
  </script>
</head>

<body>
<div id="reklama_right" >

<div id="slider_1" class="bxslider">

 <div><a href="http://" target="_blank"><img src="http://bxslider.com/images/730_200/tree_root.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://bxslider.com/images/730_200/houses.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://bxslider.com/images/730_200/hill_fence.jpg" alt="kbn" width="240" height="240"/></a></div>

 </div>

 <div id="slider_2" class="bxslider">

 <div><a href="http://" target="_blank"><img src="http://bxslider.com/images/730_200/tree_root.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://bxslider.com/images/730_200/houses.jpg" alt="kbn" width="240" height="240"/></a></div>
 <div><a href="http://" target="_blank"><img src="http://bxslider.com/images/730_200/hill_fence.jpg" alt="kbn" width="240" height="240"/></a></div>

 </div>

 </div>

</body>
</html>

kbn · #8 (**permalink**) 19.12.2014, 16:04

всё равно не работает(((((

рони · #9 (**permalink**) 19.12.2014, 16:10

kbn,
код из 7 поста работает? если работает ищите во всех скриптах строку bxSlider и убирайте -- потом поставите код из 7 поста строки 21 - 31

kbn · #10 (**permalink**) 19.12.2014, 16:18

может лучше другой слайдер попробовать? какой посоветуете?

Форум

Справочник

Discord чат

Курсы javascript