Background'a yükleniyor

16-07-2009, 13:24:39

Merhaba

Bir background'ım var. Div içinden geliyor. <div style="background:url()"> gibi

Bu büyük oldugunda yüklenene kadar arka sayfa beyaz kalıyor.

Buraya yükleniyor eklemek istiyorum.

Nasıl yapabilirim?

Teşekkürler

16-07-2009, 15:19:40

#2

Erturk

Java Script kodları:

<SCRIPT TYPE="text/javascript" LANGUAGE="javascript">
function waitPreloadPage() { 
if (document.getElementById){
document.getElementById('prepage').style.visibility='hidden';
}else{
if (document.layers){ 
document.prepage.visibility = 'hidden';
}
else { 
document.all.prepage.style.visibility = 'hidden';
}
}
}
</SCRIPT>

Sitenin <body> tagında yapacagın degişiklik:

<body onLoad="waitPreloadPage();">

<body> den sonra koyacagın <div> alanı ve yükleniyor mesajı. (İstedigin gibi geliştirebilirsin)

<div id="prepage" style="margin:50px auto;position:absolute;font:bold 20px Tahoma;color:#000;">
Yükleniyor. Lütfen bekleyiniz.
</div>

Bir dene dostum. Buyuk ıhtımalle calısacaktır.Basit ama iş görür.

16-07-2009, 15:21:22

#3

~~webadam~~

Günün Güzel Kızı | www.gununguzelkizi.com

buradaki anasayfadaki resim yüklenmesinde uygulamam gerekiyor?

16-07-2009, 15:31:00

#4

Erturk

<script type="text/javascript"> 
function getAjax() {	
	var page_request = false
	if (window.XMLHttpRequest) 
	page_request = new XMLHttpRequest()
	else if (window.ActiveXObject)
	{
		try 
		{
			page_request = new ActiveXObject("Msxml2.XMLHTTP")
		}
		catch (e)
		{
			try
			{
				page_request = new ActiveXObject("Microsoft.XMLHTTP")
			}
			catch (e)
			{
			}
		}
	}
	return page_request;
}
function ajaxsayfa(url, divid)
{
	document.getElementById(divid).innerHTML="<div id=yukleme2 align=center><br /><br /><br /><br />Sayfa Yükleniyor...<br /><br /><img align=center src=dosyalar/spinner.gif></div>"
	var page_request = getAjax();
	if(page_request==false) return false;
	page_request.onreadystatechange=function()
	{
		loadpage(page_request, divid)
	}
	page_request.open('GET', url, true)
	page_request.send(null)
}
function loadpage(page_request, divid)
{
	if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
		document.getElementById(divid).innerHTML=page_request.responseText
}
function setUserCookie(name) {
	var page_request=getAjax();
	if(page_request==false) return false;
	page_request.open('GET', 'cook.php', true);
	page_request.send(null);
}
</script>

Bunun yerine birde benım verdigimi deneyebilirmisin acaba ?

Bu arada bu sitenin agır acılmasının en buyuk sebebi günün güzeli ve ayın güzeli resimleri arkadasında kullandıgın PNG nın yuklenmesi.Background ile alakalı degil yani.PNG fix olarak ne kullanıyorsun bilmiyorum ama HTC oneririm.

16-07-2009, 15:34:41

#5

~~webadam~~

Erturk adlı üyeden alıntı: mesajı görüntüle

<script type="text/javascript"> 
function getAjax() {	
	var page_request = false
	if (window.XMLHttpRequest) 
	page_request = new XMLHttpRequest()
	else if (window.ActiveXObject)
	{
		try 
		{
			page_request = new ActiveXObject("Msxml2.XMLHTTP")
		}
		catch (e)
		{
			try
			{
				page_request = new ActiveXObject("Microsoft.XMLHTTP")
			}
			catch (e)
			{
			}
		}
	}
	return page_request;
}
function ajaxsayfa(url, divid)
{
	document.getElementById(divid).innerHTML="<div id=yukleme2 align=center><br /><br /><br /><br />Sayfa Yükleniyor...<br /><br /><img align=center src=dosyalar/spinner.gif></div>"
	var page_request = getAjax();
	if(page_request==false) return false;
	page_request.onreadystatechange=function()
	{
		loadpage(page_request, divid)
	}
	page_request.open('GET', url, true)
	page_request.send(null)
}
function loadpage(page_request, divid)
{
	if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
		document.getElementById(divid).innerHTML=page_request.responseText
}
function setUserCookie(name) {
	var page_request=getAjax();
	if(page_request==false) return false;
	page_request.open('GET', 'cook.php', true);
	page_request.send(null);
}
</script>

Bunun yerine birde benım verdigimi deneyebilirmisin acaba ?

Bu arada bu sitenin agır acılmasının en buyuk sebebi günün güzeli ve ayın güzeli resimleri arkadasında kullandıgın PNG nın yuklenmesi.Background ile alakalı degil yani.PNG fix olarak ne kullanıyorsun bilmiyorum ama HTC oneririm.

Yukardaki kodun ıcınde pek cok ajax calısıyor.

TAm olarak anlayamadım png fix derken

Nasıl hızlandırabılırım bu yavaşlığı

16-07-2009, 15:45:06

#6

Erturk

Siteyi biraz kontrol ettim. PNG leri fixlememişsin dostum. Buda IE6 gibi eski sürüm tarayıcılarda sorun yaratıyor. Yani png boslukları transparan degil acık mavi gorunuyor. Bunu engellemenin farklı yolları var. En cok kullanılanı JS yoluyla ama ben HTC ile yapıyorum. Cok rahat ayrıca cokta hızlı. Yapman gerekenler:
Eger bir style dosyan varsa (css) içerisine aşagıdaki kodu yaz.

img, div { behavior: url(dosyalar/iepngfix.htc) }

Yoksa index.php içerisinede yazabilirsin.

<style type="text/css">img, div { behavior: url(dosyalar/iepngfix.htc) }</style>

daha sonrasında verdigim linkten blank.gif ve iepngfix.htc dosyasını indirip dosyalar klasorune at.
http://server4.yuregim.com/webadam.rar
Ben buradan kontrol edicem IE6 ile. Umarım başarabilirsin.
(Her ihtimale karsı yedegini al)

Not: Bu arada şimdi farkettim de, butun resimler PNG olarak atıyorsun. Bu zaten sitenin başlı başına agır acılmasına en buyuk faktör. Mesela footer kısımında o kadar buyuk bır png yerine 2 tane (sag ve sol oval kenarlıklar) resim kullanarak yapabilrdin. Bu ve bunun gibi cok hatalı kullanmalar var

Hatalıda demiyelim; Agır calısmasını saglayan fazladan resimler...

16-07-2009, 15:48:06

#7

~~webadam~~

Erturk adlı üyeden alıntı: mesajı görüntüle

Siteyi biraz kontrol ettim. PNG leri fixlememişsin dostum. Buda IE6 gibi eski sürüm tarayıcılarda sorun yaratıyor. Yani png boslukları transparan degil acık mavi gorunuyor. Bunu engellemenin farklı yolları var. En cok kullanılanı JS yoluyla ama ben HTC ile yapıyorum. Cok rahat ayrıca cokta hızlı. Yapman gerekenler:
Eger bir style dosyan varsa (css) içerisine aşagıdaki kodu yaz.

img, div { behavior: url(dosyalar/iepngfix.htc) }

Yoksa index.php içerisinede yazabilirsin.

<style type="text/css">img, div { behavior: url(dosyalar/iepngfix.htc) }</style>

daha sonrasında verdigim linkten blank.gif ve iepngfix.htc dosyasını indirip dosyalar klasorune at.
http://server4.yuregim.com/webadam.rar
Ben buradan kontrol edicem IE6 ile. Umarım başarabilirsin.
(Her ihtimale karsı yedegini al)

Çok teşekkür ederim. Gün içinde denerim. Böylece png sorununu çözmüş oluruz.

Ancak bu kızın resminin yüklendiği kısımda bir yavaşlık var o da çözülür mü bunu yapınca yoksa ekstra bir loading koyabilir miyiz oraya?

16-07-2009, 15:54:38

#8

Erturk

Site içerisinde kullandıgın butun resimler neredeyse PNG formatında. PNG cok ii kaliteli bir format ama yuklenirken cok bekletiyor. Hele hele 500px boyutundaki bir PNG nın yuklenmesi biraz fazla zaman alır. Kaldıki şu anda bahsettiğim sorunu yasıyorsun. Benim verdigim o kod yapısı ile butun PNG leri bg olarak ayarlıyor ve ustune blank.gif ile transparan bır goruntu atıyorsun. Bu bir nebzede olsun hızlandıracak ve butun tarayıcılarda transparanlık verecektır fakat sana tavsiyem gereksiz PNG kullanımından kacınman. Siteyi kim kodladı bilmiyorum ama ozellikle CSS sini yapan arkadasa rica edersen eger gereksiz resim (ozellikle PNG) kullanımından vazgecebilir.
Bir onceki mesajımda düştügüm not gibi;
Sitenin hemen hemen her yerinde png kullanılmıs. Ornegin Footer kısımı tek renk. 900x69 boyutunda bir PNG nin yuklenmesi en az 1-2 Saniye alacaktır. Bunun yerine mantıklı bir CSS düzenlemesi ile neredeyse hiç resim kullanmadan o kısım yapılabilir.o ve onun gibi diger butun kısımlar...

16-07-2009, 15:56:50

#9

~~webadam~~

Erturk adlı üyeden alıntı: mesajı görüntüle

Site içerisinde kullandıgın butun resimler neredeyse PNG formatında. PNG cok ii kaliteli bir format ama yuklenirken cok bekletiyor. Hele hele 500px boyutundaki bir PNG nın yuklenmesi biraz fazla zaman alır. Kaldıki şu anda bahsettiğim sorunu yasıyorsun. Benim verdigim o kod yapısı ile butun PNG leri bg olarak ayarlıyor ve ustune blank.gif ile transparan bır goruntu atıyorsun. Bu bir nebzede olsun hızlandıracak ve butun tarayıcılarda transparanlık verecektır fakat sana tavsiyem gereksiz PNG kullanımından kacınman. Siteyi kim kodladı bilmiyorum ama ozellikle CSS sini yapan arkadasa rica edersen eger gereksiz resim (ozellikle PNG) kullanımından vazgecebilir.
Bir onceki mesajımda düştügüm not gibi;
Sitenin hemen hemen her yerinde png kullanılmıs. Ornegin Footer kısımı tek renk. 900x69 boyutunda bir PNG nin yuklenmesi en az 1-2 Saniye alacaktır. Bunun yerine mantıklı bir CSS düzenlemesi ile neredeyse hiç resim kullanmadan o kısım yapılabilir.o ve onun gibi diger butun kısımlar...

Belli bir ücret karşılığı ile sitenin css ve imajlarını düzenleyebilir misin?

hemde png ve bu yükleniyor problemini halletmiş oluruz