Показать сообщение отдельно
  #1 (permalink)  
Старый 09.04.2013, 11:07
Интересующийся
Отправить личное сообщение для Socgamer Посмотреть профиль Найти все сообщения от Socgamer
 
Регистрация: 10.01.2012
Сообщений: 12

Как грамотно использовать много каруселек на странице
Привет, ребята! На одном из сайтов я использую согласно макету множество каруселек и слайдеров... Возникла сложность их все корректно использовать сразу... что-то где-то не работает... Помогите, пожалуйста, разобраться.

Ссылка: http://tupinet.ru/goodwears/main2.html
Подключенные скрипты:
<!-- JS -->
    <script src="js/jquery.min.js"></script>

        <!--bootstrap-->
        <script src="js/bootstrap-modal.js"></script>
        <script src="js/bootstrap-carousel.js"></script>

        <script src='js/jquery.hoverIntent.minified.js'></script>
        <script src='js/jquery.dcmegamenu.1.3.2.js'></script>

        <!--slider thumbs-->
        <script src="js/jquery.tinycarousel.min.js"></script>

        <!--form input-->
        <script src="js/forms.js"></script>

        <!--left categories-->
        <script type="text/javascript">
            $(document).ready(function() {
                // Store variables
                var accordion_head = $('.accordion > li > a'),
                        accordion_body = $('.accordion li > .sub-menu');
                // Click function

                accordion_head.on('click', function(event) {
                    // Disable header links

                    event.preventDefault();
                    // Show and hide the tabs on click
                    if ($(this).attr('class') != 'active'){
                        accordion_body.slideUp('normal');
                        $(this).next().stop(true,true).slideToggle('normal');
                        accordion_head.removeClass('active');
                        $(this).addClass('active');
                    }
                    // зажигаем свет у родитильской категории
                    $("#clothing").click(function () {
                        $(".cat_name1").addClass("expand");
                    });

                });
            });s
        </script>

        <!--items thumbs-->
        <script type="text/javascript">
            $(document).ready(function(){
                $('#slider_1 ,#slider_2,#slider_3,#slider_4,#slider_5,#slider_6,#slider_7,#slider_8,#slider_9,#slider_10').tinycarousel({ axis: 'y'});
                $('.product-desc').css({'display':'none'});
                $('.product-desc').click(function(i){
                    link = $(i.target).attr('src');
                    $(this).next().find("img").attr('src', link);
                });
            });
        </script>

        <script type="text/javascript">
            $(document).ready(function($){
                $('#mega-menu').dcMegaMenu({
                    rowItems: '3',
                    speed: 'fast',
                    effect: 'fade'
                });
            });
        </script>


Проблемы: (пощелкайте пожалуйста на этой странице: http://tupinet.ru/goodwears/main2.html)
1) "Новинки" блок каруселька листается только в одну сторону, если попробовать нажать в другую после к примеру левой, то в URL появляется ссылка которая мешает прокрутить в другую сторону. Выше карусельки (большие картинки, бренды и популярные товары) работают вроде нормально.
2) http://clip2net.com/s/4SyKZb
Первое проверяешь при загрузке страницу крутятся ли миниатюры, потом переходишь на следующий слайд всего блока и снова щелкаешь на эти стрелки миниатюр, ничего не грузится...
вот скрипт, который использую:

Всем спасибо за ответы заранее.
Ответить с цитированием