Nova poruka

HTML code za Slideshow

poruka: 16
|
čitano: 10.931
|
moderatori: Lazarus Long, XXX-Man, vincimus
1
+/- sve poruke
ravni prikaz
starije poruke gore
shiver. 
13 godina
neaktivan
offline
sri 27.2.2013 18:49
Odgovori Citiraj
HTML code za Slideshow

Zanima me ako netko zna gdje mogu nać taj code za ubacit slideshow sa par slika kao banner na moj blog?

Inače koristim tumblr i poznato mi je editiranje u HTML al eto to ne znam kako napravit pa ako netko zna možda?

 

Znam da ima jedan dobar program FlexSlider al nažalost nije besplatan pa ako isto možete prepočit neke slične koji se mogu skinut bila bih jako zahvalna.

Poruka je uređivana zadnji put sri 27.2.2013 18:50 (shiver.).
 
trajni link
0 0 hvala 0
OriginalEXE 
12 godina
offline
sri 27.2.2013 18:53
Odgovori Citiraj
Re: HTML code za Slideshow

Za slider ti osim HTML-a treba i CSS te JS. "Program" FlexSlider je potpuno besplatan, dapače, čak i za komercijalnu upotrebu. Kako ga postaviti imaš ovdje:

http://flexslider.woothemes.com/

WordPress ❤
 
trajni link nadporuka
0 0 hvala 0
1domagoj1 
16 godina
neaktivan
offline
sri 27.2.2013 19:01
Odgovori Citiraj
HTML code za Slideshow

Napravi slideshow u gifu i ubaci ovaj kod:

<a href="http://www.stranica.com/stranica.html">
    <img src="banner.gif" border="0" width="xxx" height="xxx" alt="web stranica">
</a>Gdje su xxx velicine koje zelis za banner.

 

Mislim da je tako najlakse.

Perhaps today IS a good day to die. PREPARE FOR RAMMING SPEED!
 
trajni link
1 0 hvala 0
david7 
13 godina
offline
sri 27.2.2013 19:07
Odgovori Citiraj
HTML code za Slideshow

Nije praksa stavljati u img tag i width i height, Height se automatski mijenja te ako staviš i width i height, a ne uneseš proporcionalne dimenzije, onda će slika biti deformirana...

Moj PC  
trajni link
2 0 hvala 0
shiver. 
13 godina
neaktivan
offline
sri 27.2.2013 19:07
Odgovori Citiraj
Re: HTML code za Slideshow

odgovor na originalexe post:

 

Da dobro mislila sam sveukupan code uključujući i CSS te JS al na tom linku koji si mi dao već sam probala te kodove i ne želi ništa prikazati a kolko vidim ima sam kod za JS i HTML

 

A skinula sam FlexiSlider i ne znam možda mi je neš promaklo pa ću sad ispast glupa al ne znam kako bih ovo trebala instalirat kad nema nikakav file .exe

 

Poruka je uređivana zadnji put sri 27.2.2013 19:08 (shiver.).
 
trajni link nadporuka
0 0 hvala 0
OriginalEXE 
12 godina
offline
sri 27.2.2013 19:11
Odgovori Citiraj
Re: HTML code za Slideshow
david7 kaže...

Nije praksa stavljati u img tag i width i height, Height se automatski mijenja te ako staviš i width i height, a ne uneseš proporcionalne dimenzije, onda će slika biti deformirana...

Krivo, width i height se koriste oba kako ne bi bilo "bljeskova" kada se slika prvi put učitava, već browser zna koju dimenziju da ostavi za sliku. 

 

A ako misliš na responsive images, to nema veze s ovim tagovima već to preko CSS-a radiš.

WordPress ❤
Poruka je uređivana zadnji put sri 27.2.2013 19:15 (OriginalEXE).
 
trajni link nadporuka
0 0 hvala 0
shiver. 
13 godina
neaktivan
offline
sri 27.2.2013 19:11
Odgovori Citiraj
Re: HTML code za Slideshow

Hvala al ne bi htjela gif, ja bi baš slider, treba mi za velike dimenzije 700px x400px otprilike tako da bi gif dodatno usporio stranicu a sve ostalo što sam probala jednostavno nije upalilo. al hvala na odgovoru

Poruka je uređivana zadnji put sri 27.2.2013 19:12 (shiver.).
 
trajni link nadporuka
0 0 hvala 0
OriginalEXE 
12 godina
offline
sri 27.2.2013 19:13
Odgovori Citiraj
Re: HTML code za Slideshow
shiver. kaže...

odgovor na originalexe post:

 

Da dobro mislila sam sveukupan code uključujući i CSS te JS al na tom linku koji si mi dao već sam probala te kodove i ne želi ništa prikazati a kolko vidim ima sam kod za JS i HTML

 

A skinula sam FlexiSlider i ne znam možda mi je neš promaklo pa ću sad ispast glupa al ne znam kako bih ovo trebala instalirat kad nema nikakav file .exe

 

Pošto ti je stranica na tuđem serveru a ne na tvom računalu, instalacija bilo kakvih programa na tvoje računalo ti neće pomoći.

 

Koristiš krivi pojam, ovdje se ne radi o instaliranju. Nisam nikada koristio tumblr pa neznam koju razinu kontrole imaš. Da li možeš direktno upravljati sa html datotekama? (u smislu, da li imaš neki file editor s kojim otvoriš neki html i onda unutra imaš sve one html tagove (body,html,p,img...)) ?

WordPress ❤
 
trajni link nadporuka
0 0 hvala 0
1domagoj1 
16 godina
neaktivan
offline
sri 27.2.2013 19:15
Odgovori Citiraj
Re: HTML code za Slideshow
shiver. kaže...

Hvala al ne bi htjela gif, ja bi baš slider, treba mi za velike dimenzije 700px x400px otprilike tako da bi gif dodatno usporio stranicu a sve ostalo što sam probala jednostavno nije upalilo. al hvala na odgovoru

A onda ok, kad si rekla da bi banner, ja sam skuzio, ono tipa 300x100 px, dvije, tri slicice koje se vrte i vriste "TOP SHOP, KUPI ME" i slicno. Gif je idealan za to.

Perhaps today IS a good day to die. PREPARE FOR RAMMING SPEED!
 
trajni link nadporuka
0 0 hvala 0
shiver. 
13 godina
neaktivan
offline
sri 27.2.2013 19:26
Odgovori Citiraj
Re: HTML code za Slideshow
OriginalEXE kaže...
shiver. kaže...

odgovor na originalexe post:

 

Da dobro mislila sam sveukupan code uključujući i CSS te JS al na tom linku koji si mi dao već sam probala te kodove i ne želi ništa prikazati a kolko vidim ima sam kod za JS i HTML

 

A skinula sam FlexiSlider i ne znam možda mi je neš promaklo pa ću sad ispast glupa al ne znam kako bih ovo trebala instalirat kad nema nikakav file .exe

 

Pošto ti je stranica na tuđem serveru a ne na tvom računalu, instalacija bilo kakvih programa na tvoje računalo ti neće pomoći.

 

Koristiš krivi pojam, ovdje se ne radi o instaliranju. Nisam nikada koristio tumblr pa neznam koju razinu kontrole imaš. Da li možeš direktno upravljati sa html datotekama? (u smislu, da li imaš neki file editor s kojim otvoriš neki html i onda unutra imaš sve one html tagove (body,html,p,img...)) ?

Mislila sam možda mogu upload slike na nekom programu i onda mi on automaatski to pretvori u kod kao kad klikneš na izvor stranice pa ti se otvori sve ono al dobro nije to sad bitno.

 

Da normalno da ima editor gdje prilagođavaš izgled teme 

 

i znam da bi ovaj kod trebao ić između <body> i </body> tag, (sorry ne mogu trenutno upload sliku s kodom pa ti evo onda link koda za HTML http://flexslider.woothemes.com/ )

 

iskreno ne znam gdje bi točno trebala stavit JS kod, dal između <head></head> il <body></body> i ne znam kako da napravim css dio znači, nisam baš toliko stručna u tome zato pitam, kako mogu doć do tog CSS djela?

Poruka je uređivana zadnji put sri 27.2.2013 19:31 (shiver.).
 
trajni link nadporuka
0 0 hvala 0
david7 
13 godina
offline
sri 27.2.2013 19:31
Odgovori Citiraj
HTML code za Slideshow

Probaj staviti na sliku od cca 800x600 dimenzije 150x200 pa ćeš vidjeti...

Moj PC  
trajni link
0 0 hvala 0
OriginalEXE 
12 godina
offline
sri 27.2.2013 19:35
Odgovori Citiraj
Re: HTML code za Slideshow

Prvo se moraš pobrinuti da učitavaš jQuery (javascript library). To možeš napraviti tako da dodaš ovo unutar <head></head>:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

 

Zatim ispod toga ubaciš flexslider:

<script src="js/jquery.flexslider.min.js"></script>

Gdje je js mapa unutar koje si stavila jQuery.flexslider.min.js file koji si skinula sa http://flexslider.woothemes.com/

Ta js mapa mora biti u istom "levelu" kao i index.html file (glavni html stranice).

 

Zatim napravi (ako vec nemas) css mapu (pored js mape) i unutra stavi flexslider.css (koji si skinula) te isto unutar <head></head> dodaj:

<link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen">

 

Za kraj, također unutar <head></head> dodaj ovo:

<script>

 

$(window).load(function() {
  $('.flexslider').flexslider({
    animation: "slide"
  });
});

 

</script>

 

I još dodaj html dio gdje već trebaš.

WordPress ❤
Poruka je uređivana zadnji put sri 27.2.2013 19:35 (OriginalEXE).
 
trajni link nadporuka
1 0 hvala 1
shiver. 
13 godina
neaktivan
offline
sri 27.2.2013 19:46
Odgovori Citiraj
Re: HTML code za Slideshow
OriginalEXE kaže...

Prvo se moraš pobrinuti da učitavaš jQuery (javascript library). To možeš napraviti tako da dodaš ovo unutar <head></head>:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

 

Zatim ispod toga ubaciš flexslider:

<script src="js/jquery.flexslider.min.js"></script>

Gdje je js mapa unutar koje si stavila jQuery.flexslider.min.js file koji si skinula sa http://flexslider.woothemes.com/

Ta js mapa mora biti u istom "levelu" kao i index.html file (glavni html stranice).

 

Zatim napravi (ako vec nemas) css mapu (pored js mape) i unutra stavi flexslider.css (koji si skinula) te isto unutar <head></head> dodaj:

<link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen">

 

Za kraj, također unutar <head></head> dodaj ovo:

<script>

 

$(window).load(function() {
  $('.flexslider').flexslider({
    animation: "slide"
  });
});

 

</script>

 

I još dodaj html dio gdje već trebaš.

Hvala ti puno, to me zanimalo. sad ću odmah to probat.

 
trajni link nadporuka
0 0 hvala 0
OriginalEXE 
12 godina
offline
sri 27.2.2013 21:08
Odgovori Citiraj
Re: HTML code za Slideshow
david7 kaže...

Probaj staviti na sliku od cca 800x600 dimenzije 150x200 pa ćeš vidjeti...

Pa nisam niti mislio/napisao da će se slika sama cropati ako ja unesem dimenzije različite od originalnih.

WordPress ❤
 
trajni link nadporuka
0 0 hvala 0
david7 
13 godina
offline
sri 27.2.2013 21:47
Odgovori Citiraj
HTML code za Slideshow

Pa baš zbog toga što to nije moguće nije praksa stavljati width i height

Moj PC  
trajni link
0 0 hvala 0
OriginalEXE 
12 godina
offline
sri 27.2.2013 22:32
Odgovori Citiraj
Re: HTML code za Slideshow
david7 kaže...

Pa baš zbog toga što to nije moguće nije praksa stavljati width i height

Ali u ovom slučaju se može, ti lako možeš predvidjeti koju veličinu bannera ti sam koristiš, zar ne? Ako je već tome tako, zašto ne iskoristiti prednosti koje nosi width i height parametar?

WordPress ❤
 
trajni link nadporuka
0 0 hvala 0
1
Nova poruka
Pronađi
Prijava korisnika
E-mail:
Lozinka:
 
Aktivne teme
vrh stranice
Copyright © 2008 - 2024 Bug d.o.o. sva prava pridržana.