J query galerie - úprava fotek v thumbnails (výšky se deformují) – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

J query galerie - úprava fotek v thumbnails (výšky se deformují) – JavaScript, AJAX, jQuery – Fórum – Programujte.comJ query galerie - úprava fotek v thumbnails (výšky se deformují) – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 

Katka V.
~ Anonymní uživatel
1 příspěvek
13. 5. 2014   #1
-
0
-

Dobrý den, 
Chtěla bych poprosit o radu úpravy jquery: 
http://www.javascriptkit.com/…slider.shtml


Používam fotky na šířku i na výšku a thumbnails mi ty výškové deformuje (zachová výšku a roztáhne do šířky). V hlavním okně je to v pořádku. Nevíte, prosím, někdo, zda se dá nějak upravit, aby se ty výšky v thumbnails zobrazily celé a měly po straně prázdné místo?


Jsem docela začátečník, takže pokud někdo budete tak hodný a poradíte, tak prosím nějak polopatě. Pokud je to složité, tak mi to prosím napište a já to vyřeším jinak.


Díky, 
Katka

Nahlásit jako SPAM
IP: 188.75.128.–
peter
~ Anonymní uživatel
4014 příspěvků
15. 5. 2014   #2
-
0
-

http://www.javascriptkit.com/script/script2/thumbslide.js

container.find(".main_image_scroller") .css("height",canvas_height+"px") .css("width",canvas_width+"px")

container.find(".thumbs_list_container").css("height",canvas_height+"px");

return $(document.createElement('div')) .html($("<img src='"+encodeURI(src)+"' width=100 height=60>"))

return $(document.createElement('div')) .append($('<div style="width:100%;height:100%;background:url('+encodeURI(src)+') center center no-repeat;"></div>'))

To je velmi jednoduche. Das si vyhledavat slovo sirka nebo vyska v kodu a pak vidis, ze se to nikde neprepocitava. Takze vyber misto, kde pridas k cislo +100 a jestli se to zmeni, tak mas spravne misto, kde treba pomer stran prepocitat. Ale to bys musela posilat do scriptu take rozmery kazdeho obrazku (nejspis to tam budes muset doprogramovat, protoze v ukazce vidim pouze seznam obrazku bez vysky a sirky
'thumbs': ["church.jpg","fpslideshow/fisherman.jpg","fpslideshow/legs.jpg",""], // paths to images
). Pak je tu druha moznost, pouzit automatiku, vlastnost obrazku si prepocitat jeden z rozmeru podle druheho. To znamena smazat vysku nebo sirku z kodu. Napr.
"<img src='"+encodeURI(src)+"' width=100 height=60>"
"<img src='"+encodeURI(src)+"' width=100>" -- html si dopocita sam vysku

Jinak, samotne prepocitavani je samozrejme jednoduche
p = sirka_can / vyska_can; // pomer pro canvas
w = sirka_can;
h = p * vyska_obr; // prepocitas vysku obrazku podle pomeru canvasu
if (h > vyska_can) // a kdyz je vyska vetsi, tak to musis prepocitat opacne
{
h = vyska_can;
w = sirka_obr / p; // nebo (1/p) * sirka_obr
}
w = Math.floor(w); // a nazaver se zbavit desetinne carky
h = Math.floor(h);

Nahlásit jako SPAM
IP: 2001:718:2601:258:31f2:4b...–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 28 hostů

Podobná vlákna

Uprava a upload fotek ASP.NET — založil rybar73

Query string — založil 3bit

Session vs. Query do DB — založil jerkyrama

Okamžitá QUERY — založil Jetti

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032024 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý