У меня есть этот плагин jQuery под названием Easy Slider , который я внедряю на этом сайте , который отображает рекомендуемый контент в формате анимированных слайдов.
Если вы посетитеНа сайте вы увидите базовую реализацию , а на странице Rods чуть более тонкую настройку.На странице «Стержни» просто используется 11 экземпляров фактического слайдера.
Эта вещь изначально была создана только для одного экземпляра, но в более поздней версии была добавлена функция нескольких слайдов.Так что до сегодняшнего дня на домашней странице все работало хорошо.Сегодня я реализовал 11 экземпляров на странице Rods (используя ее для демонстрации изображений в стиле галереи продукта клиента).Чтобы реализовать несколько экземпляров, я должен был дать каждому контейнеру слайда имя с уникальным идентификатором, а затем передать параметры, чтобы также изменить сгенерированную jQuery разметку «предыдущая» и «следующая».
Разметкачто-то вроде этого:
<div id="slider-1">
<ul>
<li><img src="/img/rod.jpg" /></li>
<li><img src="/img/rod.jpg" /></li>
<li><img src="/img/rod.jpg" /></li>
<ul>
</div>
А затем сценарий генерирует два <span>
элемента после каждого слайда div, которые выглядят так:
<span id="nextBtn"><a href="#">next</a></span>
<span id="prevBtn"><a href="#">previous</a></span>
Это было очень привередливо, если не сказать больше,Я чуть не вырываю свои волосы из-за этого, потому что то, что происходит, просто не имеет для меня никакого смысла.
Вот некоторые из тех сумасшествий, которые я испытываю ...
- Реализовал несколько слайдов, и после некоторой настройки стиля я все выглядел и работал правильно в Firefox;Пошел проверить это в Chrome, где у меня была более старая версия страницы, и после обновления ни один из моих скриптов не выполнялся.Вернулся в FF и после обновления скрипты в этом браузере не выполнялись, хотя я не обновлял код вообще между обновлениями.Кроме того, я проверил свою консоль ошибок, и в ней не было ошибок.
- Вернулся к своему коду и дважды проверил, посмотрев мою локальную копию и копию действующего сервера для сравнения, без различий.Так обновил несколько раз и очистил кеш и все равно ничего.Затем отошел от моего компьютера, чтобы ударить по голове, вернулся, обновился, и сценарии jQ снова запустились!(Кстати, это касается не только скриптов EasySlide, но также и скрипта, который есть у меня сразу после нижнего колонтитула, для постепенного увеличения / уменьшения ролловера).
- Снова обновился в Chrome, и на этот раз я получаюстранное поведение, когда применяемый div имеет встроенную высоту, поэтому я не уверен, откуда он берется.Как ни странно, это выглядит по-разному в разных браузерах.В Chrome это выглядит так:
height:21px;
для каждого элемента.В Firefox это выглядит как height:271px
для первого слайда в списке и height:0px
для каждого другого слайда в списке.Понятия не имею, откуда это и почему. Хотя теперь, когда я пишу это, мне интересно, если это проблема с моей разметкой, где мне пришлось использовать <div>
внутри <ul>
? - Наконец, большинствонедавно я снова обновился в каждом браузере (и проверил также из моего Macbook), и снова сценарии не выполняются.
Возможно, есть так много проблем, которые я не могу определить, что здесь происходит.Я был бы очень признателен за другую перспективу, если бы вы могли сказать ...
- Что вы видите - только одно статическое изображение для каждой публикации Rod или набор скользящих изображений с левыми / правыми деревянными треугольными кнопками рядом?
- С какой стати скрипты периодически так терпят неудачу, как это?
- Все ли графические окна отображаются в вашем браузере на полную высоту?Если нет, то видите ли вы этот встроенный стиль и откуда он берется.
Приносим извинения за большую длину здесь, и если большая часть этого происходит из-за простого отсутствия опыта работы с javascript.Я считаю себя продвинутым с HTML и CSS, но очень начинающий с JS.Так что любые соответствующие входные данные приветствуются.