دوستان اینجا اگه یکی سوال داشته باشه فکر کنم باید یه زمان طولانی منتظر جواب باشه ... من این سوال رو مطرح کردم ... در همین مدت جوابش رو هم بدست آوردم گفتم شاید مشکل دیگران هم باشه خواستم همین جا یه توضیحی بدم ...
اول یک صفحه html درست مکنید به نام index.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>KCMOS.COM</title>
<style type="text/css">
body{
font-family:Tahoma, Geneva, sans-serif;
font-size:12px;
}
</style>
<script language="javascript" src="test.js"></script>
</head>
<body>
<a href="#" onclick="page();">تعویض کد</a><br /><br />
<div id="message"></div><br />
<div class="code" id="code">کد جدید اینجا نشان داده خواهد شد!</div>
<script type="text/javascript">
//<![CDATA[
var element = document.getElementById('code');
var duration = 1000; /* 1000 میلی ثانیه برابر با 1 ثانیه */
var steps = 20; /* میزان فِرِم های انیمیشن از حالت شفافیت کامل تا وضوح کامل */
function setopacity(level) {
element.style.opacity = level;
element.style.mozopacity = level;
element.style.khtmlopacity = level;
element.style.filter = "alpha(opacity=" + (level * 100) + ");";
}
function fadeIn(){
for (i = 0; i <= 1; i += (1 / steps)) {
setTimeout("setopacity(" + i + ")", i * duration);
}
}
//]]>
</script>
</body>
</html>
بعد از اون یه فایل js باید ساخته بشه که صفحه رو به صورت ajaxi بخونه به نام test.js:
///////////////////////////////////////////////// Main Functions /////////////////////////////////////////////////////
function createXHR(){
if(window.XMLHttpRequest)
return new XMLHttpRequest();
else
return new ActiveXObject('Microsoft.XMLHTTP');
}
/////////////////////////////////////////////////// User function /////////////////////////////////////////////////////
function page(){
var url="test.php?"//alert(url);
xmlHttp=createXHR();
xmlHttp.onreadystatechange=stateChanged1;
xmlHttp.open("GET", url , true)
xmlHttp.send(null)
}
function stateChanged1(){
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){
document.getElementById("code").innerHTML=xmlHttp.responseText;
fadeIn()
}else{
document.getElementById('code').innerHTML='Please wait';
}
}
///////////////////////////////////////////////// User Functions /////////////////////////////////////////////////////
بعد یه صفحه که در فایل js ما به نام test.php درست شده درست کنید و مثلا این مقدار رو توش قرار بدین:
echo "Sallam Kcmos";
یه توضیح مختصر --- در فایل index.php ما یه دستور جاوا اسکریپت داریم که این کار fade رو برای ما انجام میده و باید حتما بعد از div نمایش دهنده قرار بگیره که id مورد نظر رو میگیره و اون رو fade میکنه:
<script type="text/javascript">
//<![CDATA[
var element = document.getElementById('code');
var duration = 1000; /* 1000 میلی ثانیه برابر با 1 ثانیه */
var steps = 20; /* میزان فِرِم های انیمیشن از حالت شفافیت کامل تا وضوح کامل */
function setopacity(level) {
element.style.opacity = level;
element.style.mozopacity = level;
element.style.khtmlopacity = level;
element.style.filter = "alpha(opacity=" + (level * 100) + ");";
}
function fadeIn(){
for (i = 0; i <= 1; i += (1 / steps)) {
setTimeout("setopacity(" + i + ")", i * duration);
}
}
//]]>
</script>
توی این تابع از دستورات css استفاده شده که برای مرورگر های مختلف سازگاری داره:
element.style.opacity = level;
element.style.mozopacity = level;
element.style.khtmlopacity = level;
این توضیحات در حد توان من بود امیدوارم مفید واقع بشه با تشکر(در ضمن من اصلا جاوا اسکریپت بلد نیستم به صورت حرفه ای اساتید انجمن باید من رو ببخشن ... مین خودم PHP کار میکنم )