X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Помогите доработать слайдер!
Kdes70
Kdes70
Topic Starter сообщение 20.5.2012, 14:41; Ответить: Kdes70
Сообщение #1


Здравствуйте нашел вот такой Слайдер все в нем устраивает но вот есть один минус, помогите сделать чтобы блоки зацикливались то есть сделать карусель, а то они прокручиваются в одну сторону до ходят до конечного блока потом приходятся в ручную прокручивать обратно или перегружать страницу.
Заранее благодарю за любую оказанную помощь))))

PHP
<div id="slaider">
    <div id="slaiderTop"></div>
        <div id="slContent">
  <?
$resultStat = mysql_query ("SELECT * FROM data WHERE stat = 1 ORDER BY id DESC LIMIT 10",$db);
if (!$resultStat)
{
echo "<p>В данной категории объявлений не найдено</p>";
exit(mysql_error());
}
  if (mysql_num_rows($resultStat) > 0)
{
$myrowStat = mysql_fetch_array ($resultStat);
}
else
{
  echo "<p>Информация п запросу не может быть извлечена в таблице нет записей.</p>";
  exit();
}
do
{
printf("
    <div class='slide'>
  
    <img id='sl_img' src=../files/%s>
  
   <div class='sltitle'><a href='view_post.php?id=%s'>%s<a/></div>
    </div>",$myrowStat["filname"],$myrowStat["id"],$myrowStat["title"]);
  
    }
    while ($myrowStat = mysql_fetch_array ($resultStat));
?>


Js

<script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  var currentPosition = 0;
  var slideWidth = 176;
  var slides = $('.slide');
  var numberOfSlides = slides.length;
  // Убираем прокрутку
  $('#slContent').css('overflow', 'hidden');
  // Вставляем все .slides в блок #slideInner
  slides
  .wrapAll('<div id="slideInner"></div>')
  // Float left отображать по горизонтали, скорректировать .slides width
  .css({
    'float' : 'left',
    'width' : slideWidth
  });
  // Устанавливаем ширину #slideInner, равную ширине всех слайдов
  $('#slideInner').css('width', slideWidth * numberOfSlides);
  // Вставляем элементы контроля в DOM
  $('#slaider')
    .prepend('<span class="control" id="leftControl">Move left</span>')
    .append('<span class="control" id="rightControl">Move right</span>');
  // Прячем правую стрелку при загрузке скрипта
  manageControls(currentPosition);
  // Отлавливаем клик на класс .controls
  $('.control')
    .bind('click', function(){
    // Определение новой позиции
      currentPosition = ($(this).attr('id')=='rightControl')
    ? currentPosition+1 : currentPosition-1;
      // Прячет / показывает элементы контроля
      manageControls(currentPosition);
      // Move slideInner using margin-left
      $('#slideInner').animate({
        'marginLeft' : slideWidth*(-currentPosition)
      });
    });
  // manageControls: показывает или скрывает стрелки в зависимости от значения currentPosition
  function manageControls(position){
    // Спрятать левую стрелку, если это левый слайд
    if(position==0){ $('#leftControl').hide() }
    else{ $('#leftControl').show() }
    // Спрятать правую стрелку, если это последний слайд
    if(position==numberOfSlides-1){ $('#rightControl').hide() }
    else{ $('#rightControl').show() }
    }
  });
</script>
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
yury_mw
yury_mw
сообщение 20.5.2012, 18:37; Ответить: yury_mw
Сообщение #2


Kdes70, можно сделать примерно так:
после строки
currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;

добавить
if (currentPosition == numberOfSlides) currentPosition = 0;
if (currentPosition == -1) currentPosition = numberOfSlides-1;

и убрать везде вызовы функции
manageControls(currentPosition);


Да и описание функции manageControls() тоже можно убрать, потому что она как раз нужна, чтобы останавливаться в конце и в начале списка слайдов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Kdes70
Kdes70
Topic Starter сообщение 21.5.2012, 14:33; Ответить: Kdes70
Сообщение #3


спасибо!!! еще вопрос а как сделать чтобы при наведении мыши на стрелку слайды прокручивались?))
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
c0ns0l3
c0ns0l3
сообщение 21.5.2012, 21:18; Ответить: c0ns0l3
Сообщение #4


добавить тригер mouseenter или hover.
.bind('click mouseenter', function(){})

к той же анонимной ф-ции
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Kdes70
Kdes70
Topic Starter сообщение 25.5.2012, 15:32; Ответить: Kdes70
Сообщение #5


способа большей!!!!!

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Помогите вспомнить рекламного бота Телеграм для обмена рекламой
0 Mixatraider 692 21.2.2024, 23:42
автор: Mixatraider
Открытая тема (нет новых ответов) Помогите рещить проблему с монитором.
Почему низкое разрешение при подключении монитора через displayport?
0 Levels 1695 11.12.2020, 0:48
автор: Levels
Открытая тема (нет новых ответов) Помогите кто нибудь получить партнерку Росбанк!
7 heisenberg_mw 2315 7.8.2020, 9:28
автор: heisenberg_mw
Открытая тема (нет новых ответов) Помогите найти тему пожалуйста
7 virtas 12402 24.7.2020, 17:02
автор: -JamesSmips-
Открытая тема (нет новых ответов) Доработать Сайт
Нужна доработка сайта
0 nazar2292 1267 31.3.2020, 12:59
автор: nazar2292


 



RSS Текстовая версия Сейчас: 28.3.2024, 22:23
Дизайн