Перейти к содержанию
cashfile

[ОБУЧЕНИЕ] Как добавлять в OpenCart Jquery скрипты ?

Рекомендуемые сообщения

Подскажите как правильно добавлять Jquery скрипты ?

блок 1 это в файл header.tpl ?

<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>

блок2 это в файл шаблона - например home.tpl, в нужное место

<div id="slider">

images/slide1.jpg

images/slide2.jpg

images/slide3.jpg

images/slide4.jpg

</div>

блок3 сам скрипт , куда добавлять ?

<script type="text/javascript">

$(window).load(function() {

$('#slider').nivoSlider();

});

</script>

блок4 стили CSS Куда ???

добавить в общий файл CSS или отдельным файлом ???

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

css как нравится можешь отдельным файлом кинуть в папку stylesheet и прописать

<link rel="stylesheet" type="text/css" href="catalog/view/theme/default/stylesheet/nivo-slider.css" media="screen" />
а можешь и совместить файлы, главно проверь чтоб определения классов, тегов, ид не пересекались.

блок 3 в шаблон, где будет использоваться jquery, если на всех страницах то можно в хеадер засунуть. Расположение в принципе не важно, лишь бы ниже блока 1.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Толи я сука тупой то ли статью бестолочь писала - 2 дня уже извращаюсь и ничего не получается !

Подскажите как запустить : http://blog.webmasterschool.ru/archives/231

Такое чувство что-то нехватает чего-то в этой инструкции !??

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

не стоит так себя критиковать)

делал по инструкции с офф сайта: <!-- m -->http://tobia.github.com/CrossSlide/<!-- m -->

1) кинул скрипт в папку ..catalogviewjavascriptjquery.cross-slide.min.js

2) в header.tpl добавил

<script src="catalog/view/javascript/jquery.cross-slide.min.js" type="text/javascript"></script>

3) создал папку slider в ../image/ (не та image что ..catalogviewthemedefault ) и закинул туда 4 картинки

4) ну и добавить по вкусу куда надо

<div id="slideshow" style="width: 550px; height: 200px;"></div>	<script>		$('#slideshow').crossSlide({			sleep: 2,			fade: 1		}, [			{ src: '/image/slider/1.jpg' },			{ src: '/image/slider/2.jpg' },			{ src: '/image/slider/3.jpg' },			{ src: '/image/slider/4.jpg' }		])	</script>

вроде ничего не забыл

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

не стоит так себя критиковать)делал по инструкции с офф сайта: <!-- m -->http://tobia.github.com/CrossSlide/<!-- m -->1) кинул скрипт в папку ..catalogviewjavascriptjquery.cross-slide.min.js2) в header.tpl добавил

<script src="catalog/view/javascript/jquery.cross-slide.min.js" type="text/javascript"></script>
3) создал папку slider в ../image/ (не та image что ..catalogviewthemedefault ) и закинул туда 4 картинки4) ну и добавить по вкусу куда надо
<div id="slideshow" style="width: 550px; height: 200px;"></div>	<script>		$('#slideshow').crossSlide({			sleep: 2,			fade: 1		}, [			{ src: '/image/slider/1.jpg' },			{ src: '/image/slider/2.jpg' },			{ src: '/image/slider/3.jpg' },			{ src: '/image/slider/4.jpg' }		])	</script>
вроде ничего не забыл
:) заработало . Спасибо !

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Вот есть такой замечательный урок по эффектной ссылке внутри ячейки

http://ruseller.com/lessons.php?rub=28&id=571. На главной все работает идеально, но вот почему-то когда начинаеш ходить по каталогу, эффект совсем не тот который добивался... Код в хедере!

Верстаю тут: http://citysoft.ck.ua/

ЗЫ: ясли хватит сил и доверстаю шаб, отдам на растерзание юзверям :D

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Помогите разобраться с http://workshop.rs/projects/coin-slider/

Все делаю по инструкции, а в итоге консоль ошибок показывает (Ошибка: $("#coin-slider").coinslider is not a function).

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

проверьте названия файлов:)и может нужно обновить Jquery мне это помогло

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

помогите плизhttp://mewa.com.uaвставил скрипт сладерав опере, фаирфоксе отображается в эксплорере нетчто не так, что нужно исправить----:)спасибо, уже разобрался

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

не стоит так себя критиковать)делал по инструкции с офф сайта: <!-- m -->http://tobia.github.com/CrossSlide/<!-- m -->1) кинул скрипт в папку ..catalogviewjavascriptjquery.cross-slide.min.js2) в header.tpl добавил

<script src="catalog/view/javascript/jquery.cross-slide.min.js" type="text/javascript"></script>
3) создал папку slider в ../image/ (не та image что ..catalogviewthemedefault ) и закинул туда 4 картинки4) ну и добавить по вкусу куда надо
<div id="slideshow" style="width: 550px; height: 200px;"></div>	<script>		$('#slideshow').crossSlide({			sleep: 2,			fade: 1		}, [			{ src: '/image/slider/1.jpg' },			{ src: '/image/slider/2.jpg' },			{ src: '/image/slider/3.jpg' },			{ src: '/image/slider/4.jpg' }		])	</script>
вроде ничего не забыл
Все вставил, появилась картинка но одна и не меняется,В журнале вот чего: Uncaught exception: TypeError: 'd.isEmptyObject' is not a functionError thrown at line 20, column 9489 in q(O, p) in xxx/catalog/view/javascript/jquery.cross-slide.min.js: if(d.isEmptyObject(J))called from line 20, column 7302 in <anonymous function: d.fn.crossSlide>() in xxx/catalog/view/javascript/jquery.cross-slide.min.js: var r=q(k.length*2-1,function(){return r()});called from line 20, column 3426 in <anonymous function: p.onload>® in xxx/catalog/view/javascript/jquery.cross-slide.min.js: o()

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

скачал jquery-1.4.3.min.js свежий,подключил в header.tplВсе заработало!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.