Forum Sveta kompjutera

Nazad   Forum Sveta kompjutera > Internet > Web razvoj

Web razvoj Sve u vezi sa razvojem Internet sajtova: programi, dizajn, usluge hostinga, administracija...

Odgovor
 
Alatke vezane za temu Vrste prikaza
Stara 13.7.2016, 10:03   #1
Mare13
Član
 
Član od: 4.12.2007.
Poruke: 347
Zahvalnice: 43
Zahvaljeno 17 puta na 12 poruka
Određen forumom HTML i SVG slike

Pozdrav,

dakle imam problem sa prikazom slika na sajtovima.

Radim u wordpressu, i nebitno da li ubacujem SVG sliku u neki image frame ili custom html kod u wordpressu, browser mi ne prikazuje slike sa tom exentzijom.

Bude slika u kodu, ali se ne vidi dok joj ne dam visinu i to samo u pikselima radi.

E sad, kolege na isti nacin exportuju svg kao i ja i njihove slike rade bez problema i bez zadavanja visine, ne moram ni sirinu da stavim, i to na istom sajtu. Znaci, exportujemo istu sliku iz Illustrator fajla, oni mi je posalju, ja je ubacim i radi, a ja na isti nacin exportujem i slike nema dokle god joj ne zadam visinu, a visina u pixelima mi predstavlja problem kod responsivnosti. Da li je neko slucajno imao ovakav problem?

Ovo su postavke kad exportujem, isto kao i kolege koristim SVG Tiny 1.2

Mare13 je offline   Odgovor sa citatom ove poruke
Stara 13.7.2016, 10:45   #2
Neutrino
Deo inventara foruma
 
Član od: 17.6.2011.
Poruke: 7.336
Zahvalnice: 94
Zahvaljeno 3.334 puta na 2.010 poruka
Određen forumom Re: HTML i SVG slike

Kratak odgovor: SVG ti verovatno nema definisan viewBox atribut koji definiše proporciju vektorskog fajla pa browseri koriste svoje metode za proračun dimenzija (IE je posebno "specijalan" po tom pitanju).

Dugačak odgovor: detaljno objašnjenje zašto i kako možeš da pročitaš ovde - https://css-tricks.com/scale-svg/

Takođe sam primetio da koristiš "Save As" umesto "Export" opcije. Ukoliko koristiš CC 2015 pređi na "Export" opciju jer generiše fajlove koji su optimizovani i prilagođeni za web.

Ako i dalje imaš problema postavi kod SVG-a i gde ga koristiš pa da vidimo šta se dešava.
Neutrino je offline   Odgovor sa citatom ove poruke
Stara 13.7.2016, 11:07   #3
Mare13
Član
 
Član od: 4.12.2007.
Poruke: 347
Zahvalnice: 43
Zahvaljeno 17 puta na 12 poruka
Određen forumom Re: HTML i SVG slike

Hvala ti na odgovoru,

Nisam siguran da smem da kacim link sajta pa evo ti ovako, ovo je inspect slike koja radi bez problema. Znaci poslali su mi, ja sam ubacio u image frame wp teme koju koristimo i to je to, sve u redu ( ta narandzasta slika iznad )



Onda ja exportujem SVG isto tako je ubacim, ima je u kodu ali se ne prikazuje. Sto se tice Save As, tako i oni rade, a ja u "Export" nemam da biram SVG kad treba da sacuvam. Koristim bas CC 2015

Otvorio sam njihov SVG i moj u Sublime-u evo pocetak koda, verujem da je samo to bitno

Njihova koja radi:




Moja koja ne radi:



EDIT: Sad tek vidim u njihovom kodu da slika ima sirinu i visinu, a kako moja nema, nemam pojma. Bice da je u tome problem
Mare13 je offline   Odgovor sa citatom ove poruke
Stara 13.7.2016, 11:20   #4
Neutrino
Deo inventara foruma
 
Član od: 17.6.2011.
Poruke: 7.336
Zahvalnice: 94
Zahvaljeno 3.334 puta na 2.010 poruka
Određen forumom Re: HTML i SVG slike

SVG je vektorski format što znači da čak i sa definisanim viewBoxom, koji diktira proporciju, moraš da navedeš bar jednu dimenziju u HTML/CSS kodu da bi SVG bio ispravno prikazan.

Navedi makar širinu SVG-a i browseri će sami proračunati visinu.
Neutrino je offline   Odgovor sa citatom ove poruke
Sledeći korisnik se zahvaljuje korisniku Neutrino na korisnoj poruci:
Mare13 (13.7.2016)
Stara 13.7.2016, 11:29   #5
Mare13
Član
 
Član od: 4.12.2007.
Poruke: 347
Zahvalnice: 43
Zahvaljeno 17 puta na 12 poruka
Određen forumom Re: HTML i SVG slike

Da, jasno mi je to postalo nakon sto sam za svaku sliku morao da stavljam visinu

Jedino eto to sto me buni kako kad oni exportuju, u njihovom SVG-u odmah ima definisana visina i sirina a kod mene ne. Al' dobro necu vise da te davim, hvala na objasnjenjima
Mare13 je offline   Odgovor sa citatom ove poruke
Stara 13.7.2016, 11:42   #6
Neutrino
Deo inventara foruma
 
Član od: 17.6.2011.
Poruke: 7.336
Zahvalnice: 94
Zahvaljeno 3.334 puta na 2.010 poruka
Određen forumom Re: HTML i SVG slike

Ako te interesuje da naučiš sve što ima da se nauči o SVG-u preporučujem odličnu seriju Chris Coyiera - https://css-tricks.com/lodge/svg/

Isto tako Sara Soueidan ima nekoliko jako dobrih članaka na tu temu - https://sarasoueidan.com/tags/svg/

Oboje su dokazane legende web designa (Chris Coyier je i vlasnik codepen.io).
Neutrino je offline   Odgovor sa citatom ove poruke
Sledeći korisnik se zahvaljuje korisniku Neutrino na korisnoj poruci:
Mare13 (13.7.2016)
Stara 13.7.2016, 11:45   #7
Mare13
Član
 
Član od: 4.12.2007.
Poruke: 347
Zahvalnice: 43
Zahvaljeno 17 puta na 12 poruka
Određen forumom Re: HTML i SVG slike

E odlicno, procitacu ovo. Hvala jos jednom
Mare13 je offline   Odgovor sa citatom ove poruke
Stara 13.7.2016, 11:59   #8
Mare13
Član
 
Član od: 4.12.2007.
Poruke: 347
Zahvalnice: 43
Zahvaljeno 17 puta na 12 poruka
Određen forumom Re: HTML i SVG slike

Nasao sam u cemu je problem. Ne sme da bude otkaceno "Responsive" u save options kad se cuva SVG
Mare13 je offline   Odgovor sa citatom ove poruke
Stara 13.7.2016, 12:22   #9
Neutrino
Deo inventara foruma
 
Član od: 17.6.2011.
Poruke: 7.336
Zahvalnice: 94
Zahvaljeno 3.334 puta na 2.010 poruka
Određen forumom Re: HTML i SVG slike

Ako "Responsive" opcija nije čekirana SVG će koristi apsolutne jedinice za sve elemente. Pogledaj <rect> elemente u svom kodu. Videćeš da sve imaju width i height atribute. Ako imaš nameru da ti se SVG razvlači "responsive" opcija je obavezna.

I kao što već rekoh, pošto koristiš CC 2015 verziju (19.0) pređi na "Export" opciju. Mnogo je bolja od "Save As" za web design.
Neutrino je offline   Odgovor sa citatom ove poruke
Stara 13.7.2016, 12:34   #10
Mare13
Član
 
Član od: 4.12.2007.
Poruke: 347
Zahvalnice: 43
Zahvaljeno 17 puta na 12 poruka
Određen forumom Re: HTML i SVG slike

Sve jasno i logicno sto hoces da kazes, ali.. Cak i kad su apsolutne jedinice za SVG sliku u ovoj nasoj temi na WP-u slika je responsivna. Tj. valjda je taj img frame u kom je slika responsivan pa se zbog toga i slika smanjuje, tako da nemam nikakvih problema sa tim sto sam iskljucio to "responsive"

Druga mogucnost je to sto ova tema svakoj slici dodaje neku "responsiv" klasu pa mozda ima neka skripta koja u temi resizuje sama slike.

A ovo za Export, vec sam ti napisao, ja nemam opciju za SVG kad hocu export

Mare13 je offline   Odgovor sa citatom ove poruke
Stara 13.7.2016, 12:55   #11
Neutrino
Deo inventara foruma
 
Član od: 17.6.2011.
Poruke: 7.336
Zahvalnice: 94
Zahvaljeno 3.334 puta na 2.010 poruka
Određen forumom Re: HTML i SVG slike

Citat:
Mare13 kaže: Pregled poruke
A ovo za Export, vec sam ti napisao, ja nemam opciju za SVG kad hocu export

Uradi update na najsvežiju verziju CC-a.

Neutrino je offline   Odgovor sa citatom ove poruke
Sledećih 2 korisnika se zahvaljuje korisniku Neutrino na korisnoj poruci:
Mare13 (13.7.2016), Oggy (13.7.2016)
Odgovor

Bookmarks sajtovi

Alatke vezane za temu
Vrste prikaza

Vaš status
Ne možete postavljati teme
Ne možete odgovarati na poruke
Ne možete slati priloge uz poruke
Ne možete prepravljati svoje poruke

BB kod: uključeno
Smajliji: uključeno
[IMG] kod: uključeno
HTML kod: isključeno


Slične teme
tema temu započeo forum Odgovora Poslednja poruka
[Multi] Slike sa Mobilnih Aparata od 2000g do danas! King SRB Aparati i oprema 455 3.2.2020 18:58
Joomla custom css i html Dejan777 Web razvoj 0 24.7.2014 12:12
[Android] Nestale slike iz galerije? Rohirim Programi za mobilne telefone 7 8.8.2013 15:25
Pitanje za HTML IgorT Web razvoj 12 16.9.2012 1:24
[HTML] HTML tutorijali na srpskom MilanSM Klijentske aplikacije 12 11.8.2007 17:54


Sva vremena su po Griniču +2 h. Sada je 7:51.


Powered by vBulletin® verzija 3.8.7
Copyright ©2000–2024, vBulletin Solutions, Inc.
Hosted by Beograd.com