DevProTalk

Forumi IT profesionalaca
web development, web design, e-business, SEO


Idite nazad   DevProTalk > DevProTalk > Sva početnička pitanja
Želite da se reklamirate ekskluzivno na ovoj poziciji? Javite se

Sva početnička pitanja Sva početnička pitanja bi trebala da se postavljaju u ovom forumu, a ako se pretvori u kvalitetnu diskusiju interesantnu svima - prebacićemo je u odgovarajući forum. Molimo "znalce" da ne omalovažavaju početnike, ako žele da pomognu svi ćemo biti zahvalni, ako ne žele, neka preskoče ovaj forum.

Odgovori
 
Alati teme Način prikaza
Staro 04. 07. 2011.   #1
Mitrović Srđan
profesionalac
Qualified
 
Datum učlanjenja: 20.04.2007
Lokacija: Majur/Sabac
Poruke: 129
Hvala: 6
1 "Hvala" u 1 poruci
Mitrović Srđan is on a distinguished road
Default Moderniyr Problem

Pozdrav,
da li neko koristi modernizr ?
http://www.modernizr.com/

Posto su mi potrebne neke funkcije css3 za IE tipa font-face itd.
Koliko vidim prosto se doda skript u head i
<html lang="en" dir="ltr" id="ala-modernizr-sample" class="no-js">

medjutim meni se ne desava nista.
evo example code. Opet u IE ne sljaka

Kôd:
<!DOCTYPE html> 
<html lang="en" dir="ltr" id="ala-modernizr-sample" class="no-js"> 
<head> 
	<meta charset="utf-8"> 
	<title>My Beautiful Sample Page</title> 
	<script src="modernizr-1.1.js"></script> 
	<style type="text/css" media="screen"> 
		/* Thinnify type in Safari */
		body { -webkit-text-stroke:1px transparent; }
		@media only screen and (max-device-width:480px) {body{-webkit-text-stroke:0 black;}}
 
		html,
		body {
			background: #ef8dbb;
			color: #141414;
			font: normal 14px/20px Helvetica, Verdana, Arial, sans-serif;
			margin: 0;
			padding: 0;
			text-align: center;
		}
		a:link,
		a:visited {
			color: #941350;
			font-weight: bold;
		}
		a:visited {
			color: #666;
		}
		a:focus,
		a:hover {
			color: #e33a89;
			text-decoration: none;
		}
		img {
			vertical-align: bottom;
		}
		#content {
			background: #fafafa;
			border: 2px outset #666;
			margin: 20px auto 10px;
			padding: 40px 40px 20px;
			text-align: left;
			width: 500px;
		}
		#content h1+p {
			margin: 20px 0;
		}
		#content h1+p:first-line {
			font-weight: bold;
			font-variant: small-caps;
		}
		h1 {
			color: #e33a89;
			font: 27px/27px Baskerville, Palatino, Palatino Linotype, Book Antiqua, Georgia, serif;
			margin: 0;
			text-shadow: #aaa 5px 5px 5px;
		}
		section {
			float: right;
			text-align: justify;
			width: 200px;
		}
		section h2 {
			background: url(modernizr-logo.gif) 53px 5px no-repeat;
			margin: 0;
			height: 70px;
			text-indent: -9999px;
			width: 200px;
		}
		section p {
			font-size: 12px;
			line-height: 16px;
			margin: 0 0 20px;
			padding: 0 40px 0 0;
			width: 200px;
		}
		ol.features {
			font-size: 12px;
			line-height: 18px;
			list-style: none;
			margin: 0;
			padding: 0;
		}
		p.download {
			font-size: 12px;
		}
		footer {
			font-size: 11px;
			font-style: oblique;
		}
		footer a {
			font-style: normal;
		}
	</style> 
</head> 
 
<body> 
 
	<div id="content"> 
		<h1>My Beautiful Sample Page</h1> 
		
		<p>New features in CSS3 and HTML5 allow web developers to build increasingly elegant websites using very clean and semantic markup. It offers them exciting features like localStorage, and using advanced CSS3 techniques to style it all. Sadly, it isn't quite as simple as that; the many different levels of support for all these features across the entire browser landscape has given many developers a headache. Since aspirin can't be distributed via https, alternative solutions had to be created. One such solution is Modernizr, a library that detects the availability of features in the current browser and makes that information available to the web developer.</p> 
 
		<section> 
			<h2>Modernizr</h2> 
			<p><a href="http://www.modernizr.com/" rel="external">Modernizr</a> is an open source JavaScript library that aims to make the process of using the latest and greatest technologies on the web a little easier. With Modernizr, you can target CSS and JavaScript specifically based on each feature the current browser supports.</p> 
		
			<img src="photo.jpg" width="200" height="300" alt="Photo of audience seats in an auditorium-like formation, resembling a 3-dimensional representation of the Modernizr logo."> 
		</section> 
 
		<p>Here is a list of the features Modernizr detects:</p> 
	
		<ol class="features"> 
			<li class="applicationcache">applicationCache</li> 
			<li class="borderimage">border-image:</li> 
			<li class="borderradius">border-radius:</li> 
			<li class="boxshadow">box-shadow:</li> 
			<li class="canvas">Canvas</li> 
			<li class="canvastext">Canvas Text</li> 
			<li class="csstransforms">CSS 2D Transforms</li> 
			<li class="csstransforms3d">CSS 3D Transforms</li> 
			<li class="cssanimations">CSS Animations</li> 
			<li class="csscolumns">CSS Columns</li> 
			<li class="cssgradients">CSS Gradients</li> 
			<li class="cssreflections">CSS Reflections</li> 
			<li class="csstransitions">CSS Transitions</li> 
			<li class="fontface">@font-face</li> 
			<li class="geolocation">Geolocation API</li> 
			<li class="hsla">hsla()</li> 
			<li class="audio">HTML5 Audio</li> 
			<li class="video">HTML5 Video</li> 
			<li class="input">Input Attributes</li> 
			<li class="inputtypes">Input Types</li> 
			<li class="localstorage">localStorage</li> 
			<li class="multiplebgs">Multiple backgrounds</li> 
			<li class="opacity">opacity:</li> 
			<li class="rgba">rgba()</li> 
			<li class="sessionstorage">sessionStorage</li> 
			<li class="webworkers">Web Workers</li> 
		</ol> 
	
		<p class="download"><a href="http://www.fontsquirrel.com/fonts/Beautiful-ES" rel="external">Download <cite>Beautiful ES</cite> on Fontsquirrel.com</a></p> 
	</div> 
	
	<footer>This page was created by <a href="http://farukat.es/" rel="external me">Faruk Ateş</a> for <a href="http://www.alistapart.com/articles/taking-advantage-of-html5-and-css3-with-modernizr">A List Apart issue 308</a></footer> 
	
</body> 
</html>
Mitrović Srđan je offline   Odgovorite uz citat
Staro 04. 07. 2011.   #2
[nq]
web dude
Grand Master
 
Datum učlanjenja: 09.06.2005
Poruke: 912
Hvala: 46
24 "Hvala" u 21 poruka
[nq] is on a distinguished road
Default

^ procitaj ti jos jedanput sta modernizr radi
[nq] je offline   Odgovorite uz citat
Staro 04. 07. 2011.   #3
Mitrović Srđan
profesionalac
Qualified
 
Datum učlanjenja: 20.04.2007
Lokacija: Majur/Sabac
Poruke: 129
Hvala: 6
1 "Hvala" u 1 poruci
Mitrović Srđan is on a distinguished road
Default

Koliko sam ja skontao on bi trebao da omoguci CSS3 svojstva browserima koji ih po defaultu nemaju tipa IE?
Mitrović Srđan je offline   Odgovorite uz citat
Staro 04. 07. 2011.   #4
webarto
expert
Grand Master
 
Avatar webarto
 
Datum učlanjenja: 11.04.2010
Poruke: 998
Hvala: 141
959 "Hvala" u 153 poruka
webarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished road
Default

Ne, služi samo za dijagnostiku, da li je taj browser to podržava...

Citat:
Modernizr tells you whether the current browser has implemented a given feature.
__________________
Github // LinkedIn // PHP // ZCE // Stackoverflow PHP // Site5 Web Hosting
webarto je offline   Odgovorite uz citat
Staro 04. 07. 2011.   #5
Mitrović Srđan
profesionalac
Qualified
 
Datum učlanjenja: 20.04.2007
Lokacija: Majur/Sabac
Poruke: 129
Hvala: 6
1 "Hvala" u 1 poruci
Mitrović Srđan is on a distinguished road
Default

Mhm nisam onda najbolje razumeo.
Da li postoji siguran nacin da korisitm font-face u IE?

Hvala unapred
Mitrović Srđan je offline   Odgovorite uz citat
Staro 04. 07. 2011.   #6
webarto
expert
Grand Master
 
Avatar webarto
 
Datum učlanjenja: 11.04.2010
Poruke: 998
Hvala: 141
959 "Hvala" u 153 poruka
webarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished roadwebarto is on a distinguished road
Default

Uvijek imaš cufon http://cufon.shoqolate.com/generate/, ali ako nećeš koristiti kao body font već samo za headere itd. U čemu je problem sa IE uostalom?
__________________
Github // LinkedIn // PHP // ZCE // Stackoverflow PHP // Site5 Web Hosting
webarto je offline   Odgovorite uz citat
Staro 04. 07. 2011.   #7
Br@nkoR
banned
Professional
 
Avatar Br@nkoR
 
Datum učlanjenja: 04.06.2005
Poruke: 371
Hvala: 0
738 "Hvala" u 83 poruka
Br@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoroBr@nkoR će postati "faca" uskoro
Default

IE od verzije 4 podržava font-face, potrebno je da font bude u formatu *.eot
http://webfonts.info/wiki/index.php?...rowser_support

http://www.fontsquirrel.com/fontface/generator
__________________
Don't look at me; I'm lost too.
“If you can't dazzle them with brilliance, baffle them with bul*s**t.”

Poslednja izmena od Br@nkoR : 04. 07. 2011. u 17:21.
Br@nkoR je offline   Odgovorite uz citat
"Hvala" Br@nkoR za poruku:
Staro 04. 07. 2011.   #8
chandler
član
Certified
 
Datum učlanjenja: 30.01.2009
Poruke: 77
Hvala: 15
16 "Hvala" u 11 poruka
chandler is on a distinguished road
Default

Da bi koristio font face, trebalo bi ovako nesto da dodas u css i izmenis:

Kôd:
@font-face {
    font-family: 'ArimoRegular';
    src: url('fonts/Arimo-Regular-Latin-webfont.eot');
    src: url('fonts/Arimo-Regular-Latin-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Arimo-Regular-Latin-webfont.woff') format('woff'),
         url('fonts/Arimo-Regular-Latin-webfont.ttf') format('truetype'),
         url('fonts/Arimo-Regular-Latin-webfont.svg#ArimoRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
Pored ovoga, stavis sve ove fontove u fonts folder naravno. Ceo kit mozes skinuti ovde npr:

http://www.fontsquirrel.com/fonts/arimo

Ovi .eot fontovi su za ie. Mada gledaj da izaberes neki font sa linka gore, jer moze biti komplikovanije praviti sve ostale fontove, a i zbog licenci, jer ne znam za kakav projekat ti treba.

Evo procitaj i ovo: http://blog.themeforest.net/tutorial...-face-support/

A za podrsku css3 opcija, treba ti css3pie.com/.
chandler je offline   Odgovorite uz citat
"Hvala" chandler za poruku:
Staro 05. 07. 2011.   #9
Mitrović Srđan
profesionalac
Qualified
 
Datum učlanjenja: 20.04.2007
Lokacija: Majur/Sabac
Poruke: 129
Hvala: 6
1 "Hvala" u 1 poruci
Mitrović Srđan is on a distinguished road
Default

Hvala
Sa ovim .EOT trikom ili sta je vec sam se snasao i radi perfektno.

Hvala jos jednom
Mitrović Srđan je offline   Odgovorite uz citat
Odgovori


Alati teme
Način prikaza

Pravila pisanja
Možete ne započinjati nove teme
Možete ne slati odgovore
Možete ne slati priloge
Možete ne izmeniti svoje poruke
vB kôd je Uključen
Smajliji su Uključen
[IMG] kod je Uključen
HTML kôd je Isključen
Pogledajte forum


Vreme je GMT +2. Trenutno vreme je 02:25.


Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.
Mišljenja, saveti, izjave, ponude ili druge informacije ili sadržaji nastali na Sajtu su vlasništvo onoga ko ih je kreirao, a ne DevProTalk.com, tako da ne morate da se oslanjate na njih.
Autori poruka su jedini odgovorni za ovakve sadržaje. DevProTalk.com ne garantuje tačnost, kompletnost ili upotrebnu vrednost informacija, stavova, saveta ili datih izjava. Ne postoje uslovi pod kojima bi mi bili odgovorni za štetu ili gubitak koji je posledica bilo čijeg oslanjanja na nepouzdane informacije, ili bilo kakve informacije nastale kroz komunikaciju između registrovanih članova.
Web sajt može sadržavati linkove na druge web sajtove na Internetu ili neke druge sadržaje. Ne kontrolišemo niti podržavamo te druge web sajtove, niti smo pregledali bilo kakve sadržaje na takvim sajtovima. Mi nećemo biti odgovorni za legalnost, tačnost ili prikladnost bilo kog sadržaja, oglasa, proizvoda, usluga ili informacije lociranim na ili distribuiranih kroz druge web sajtove, niti za bilo kakvu štetu nastalu kao posledica takvih informacija. DevProTalk.com drži i čuva druga prava vlasništva na web sajtu. Web sajt sadrže materijale zaštićene copyright-om, zaštitne znakove i druge informacije o pravu vlasništva ili softver. Članovi mogu poslatu informacije zaštićene pravima vlasništva njihovih nosilaca i ona ostaju zaštićena bez obzira da li su oni koji prenose te informacije to naveli ili ne. Osim informacija koje su u javnom vlasništvu ili za koje dobijete dozvolu, nemate pravo da kopirate, modifikujete ili na bilo koji način menjate, objavljujete, prenosite, distribuirate, izvršavate, prikazujete ili prodajte bilo koju informaciju zaštićenu pravima vlasništva. Slanjem informacija ili sadržaja na bilo koji deo DevProTalk.com, Vi automatski dozvoljavate i predstavljate garanciju da imate pravo da dozvolite DevProTalk.com ili članovima DevProTalk.com bespovratnu, kontinualnu, neograničenu, globalnu dozvolu da koriste, kopiraju, izvršavaju, prikazuju i distribuiraju takve informacije i sadržaje i da iz takvih sadžaja koriste bilo koji deo u bilo koje svrhe, kao i pravo i dozvolu da koriste gore navedene sadržaje. Svi zaštitni znakovi (trademarks), logotipi, oznake usluga, firme ili imena proizvoda koji se pominju na ovom web sajtu su vlasništvo kojim raspolažu njihovi vlasnici.