< návrat zpět

Diskuse


Téma: Vložení slideru do hlavičky webu rss

Zaslal/a 17.10.2014 23:10

Potřebuju poradit jak mám vložit javascriptový slider do hlavičky webu. Mám stažené soubory a složky - upravený slider, s tím si vím rady. akorát nevím jak a kam to všechno správně dát, aby fungoval. je to jquery slider tady odsud http://www.jssor.com/support.html poradíte mi někdo, nemáte zkušenosti? děkuju V.

Zaslat odpověď >

#019189
Tam je toho moc, z toho návodu http://www.jssor.com/development/index.html ti to nejde vyčíst?
#019190
no právě že tam je ten js kód, ten si vložím do hlavičky stránek, aby spustil ten skript - ale někam musím vložit přes FTP složky s obrázkama, a další soubory které k tomu slideru patří. taky je tam html kód který už nevím kam vložit. jsem z toho zmatený. nevím co layoutu, co do template..... 6
#019191
Tady opravdu není moc co vysvětlovat, pokud neznáte systém jak se zapisují cesty k souborům bude to problém,... z uvedeného manuálu

<script src="jquery.min.js"></script>
<script src="jssor.slider.mini.js"></script>
<script>
jQuery(document).ready(function ($) {
var options = { $AutoPlay: true };
var jssor_slider1 = new $JssorSlider$('slider1_container', options);
});
</script>

Tohle přijde do template.php je třeba jen upravit ty cesty podle toho kam umístíte soubory jssor.slider.mini.js
jquery.min.js

<div id="slider1_container" style="position: relative; top: 0px; left: 0px; width: 600px; height: 300px;">
<!-- Slides Container -->
<div u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 600px; height: 300px;">
<div><img u="image" src="image1.jpg" /></div>
<div><img u="image" src="image2.jpg" /></div>
</div>
</div>


Toto vložíte tam kde chcete mít obsahově slider... třeba do boxu který je v záhlaví webu a nebo sprostě do template.php (přes boxy se ale snadněji edituje dle mého)
opět je třeba upravit cesty src="image1.jpg" dle umístění obrázků.... (např src="upload/slider/image1.jpg" )

Pro další radu zkuste implementovat a pokud by nešlo pošlete odkaz na web.
#019192
tak jsem to tam vložil, cesty jsem upravil a pořád to nefunguje.
Odkaz na web - http://madebymonika.cz/
nahoře - namísto hlavičky nad menu bych chtěl vložit ten slider.
#019193
problém je ve špatně uvedené cestě, vidím v kódu
<div><img u="image" src="../slider/img/home/01.jpg"></div> což by znamenalo, že obrázek se načítá z http://madebymonika.cz/slider/img/home/01.jpg což ale není pravda protože obrázek je ve složce templatu http://madebymonika.cz/plugins/templates/modr/slider/img/home/01.jpg a to jsem trefil na první pokus 9

takže řešení jsou dvě:
1. nakopírovat složku slider do rootu webu
2. upravit cesty pro načítání tak aby se načítali tam kde jsou umístěny
#019196
OK, to jsem přehlédl :-) Děkuji JD. Myslel jsem že když upravuju template.php - tak píšu cestu jen od umístění template, a ne celou - tak proto jsem to tak měl.
Teď bych potřeboval ještě pár detailů :-)
čím udělám hlavičku plovoucí - při změně velikosti okna, aby se posunovala jako zbytek designu?
Proč mi nefungují přechodové efekty mezi fotkami slideshow?
Jak a kam bych měl vlžit skripty pro "přilétávající texty" - jako jsou tady? http://www.jssor.com/demos/introduction-slider.html
#019197
pro začátek by neškodilo si celý obsah uzavřít do jednoho divu, kterému nastavíš margin: 0 auto; a šířku... ted tam máš nějaký warper v kterém je slider, pak menu a pak nějaké page v kterém je obsah... ideální je mí základní div který vymezí tu polohu prostoru v kterém se pak nachází vše ostatní.
#019198
Tak velikost už se mi přizpůsobuje, díky. Wraper tam mám proto, že v layout.css mám vložený background obrázek, který je normálně schovaný pod sliderem, ale je vidět v případě, že má někdo zakázanou javu, pak vidí alespoň statickou hlavičku a ne prázdné pole. Nevím jestli se to tak dělá, já sem si to tak vymyslel :-)
#019204
Děkuji všem za rady, nemůžete ještě někdo poradit se zbývajícími problémy?

Proč mi nefungují přechodové efekty mezi fotkami slideshow?
Jak a kam bych měl vlžit skripty pro "přilétávající texty" - jako jsou tady? http://www.jssor.com/demos/introduction-slider.html

Děkuji