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

[cashfile]

Подскажите как правильно добавлять 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 или отдельным файлом ???

[Fix305]

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

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

а можешь и совместить файлы, главно проверь чтоб определения классов, тегов, ид не пересекались.

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

[cashfile]

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

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

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

[Fix305]

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

делал по инструкции с офф сайта: <!-- 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>

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

[cashfile]

не стоит так себя критиковать)делал по инструкции с офф сайта: <!-- 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>

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

:) заработало . Спасибо !

[manager2up]

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

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

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

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

[kroosh]

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

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

[waterfall]

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

[shqarok]

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

[DADy]

не стоит так себя критиковать)делал по инструкции с офф сайта: <!-- 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()

[DADy]

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