Türkiye'nin En Eski Webmaster Forumu İyinet'e Hoşgeldiniz!

degisen ekran cozunurlugune gore css

stonecrusher

0
Onaylı Üye
Üye
Katılım
6 Ağustos 2012
Mesajlar
40
Açılan Konu
9
Tepki puanı
0
merhaba arkadaslar sizden fikir almak istiyorum.
suan bir site uzerinde calısıyorum ve siteyi 1024x768 ebatlarına gore tasarladım.sizden ogrenmek sitedigim ornegin kullanıcının biri 1366x768 boyutunda ekran cozunurlugu kullanıyorsa sitenin kenarları bos kalıyor bu durumu nasıl cozebilirim?simdiden tesekkurler
 

Ozkan

0
Onaylı Üye
Üye
Katılım
25 Eylül 2010
Mesajlar
2,130
Açılan Konu
246
Tepki puanı
27
Konum
İstanbul
genelde çoğu site bu şekildedir site ortada kalır ama tam olarak anlamadım ne demek istediğinizi
 

Darkart

0
Onaylı Üye
Üye
Katılım
1 Temmuz 2005
Mesajlar
7,037
Açılan Konu
291
Tepki puanı
53
Olusturdugun divleri pixel ile degilde yuzde ile belirlersen her cozunurlukte sayfa ona gore genisler. Zaten sende diyorsun siteyi 1024x768 e gore tasarladim diye, boyle yapmaman lazimdi.
 

by_karahan

1
Onaylı Üye
Üye
Katılım
16 Mayıs 2010
Mesajlar
421
Açılan Konu
7
Tepki puanı
2
Konum
Root :)
css değerlerini "yüzde" olarak, fontları ise "em" olarak gir.

width:50%;
fon-size:1.5em;

gibi...

Olmazsa daha fazla uğraşarak her çözünürlük için farklı bir css dosyası oluşturun. Örneğin,

640X480.css
800x600.css
1024x768.css
1280x800.css
1280x1024.css
1440x900.css
1680x1050.css
1920x1200.css

gibi, her çözünürlüğe özel yeni css tanımlamaları yaparak ayrı ayrı oluşturun. Daha sonra aşağıdaki javascript yardımıyla hangi çözünürlükteki bir monitörden girildiyse, ona ait css dosyasının çalışmasını sağlayabilirsin.

Kod:
<script type="text/javascript">

function getcss(cssfile){

loadcss = document.createElement('link')

loadcss.setAttribute("rel", "stylesheet")

loadcss.setAttribute("type", "text/css")

loadcss.setAttribute("href", cssfile)

document.getElementsByTagName("head")[0].appendChild(loadcss)

}

if(screen.width <= '800')
// Defines the resolution range you're targeting (less than 800 pixels wide in this case)

{

getcss('800x600.css')
// Defines the .css file you want to load for this range (800x600.css)

}



else if(screen.width > '800' && screen.width < '1280')
// This time we're targeting all resolutions between 800 and 1280 pixels wide

{

getcss('1024x768.css')
//And we want to load the .css file named "1024x768.css"

}


else if(screen.width > '1024' && screen.width < '1600')
//Targeting screen resolutions between 1024 and 1600px wide

{

getcss('1280x1024.css')
//Load 1280x1024.css

}



else

{

getcss('1280x1024.css')
//This else statement has "if" condition. If none of the following criteria are met, load 1280x1024.css

}

</script>
 

stonecrusher

0
Onaylı Üye
Üye
Katılım
6 Ağustos 2012
Mesajlar
40
Açılan Konu
9
Tepki puanı
0
cevaplarınız icin tesekkurler.by_karahan 'nın dedigi gibi yapacam sitenin gelisim surecinde guncelleme yoluna gidecem en dogrusu bu gibi cunku css dosyası 200 kb larda zaman alır degistirmek
 
Üst