کد ایجاد بنر متحرک در سایت

کد ایجاد بنر متحرک در سایت این کد برای ایجاد چندین بنر در یک کادر مورد استفاده قرار میگیرد.

نحوه کار این کد به این صورته که شما تعداد بیشمار بنر را میتوانید در کد جاساز کرده و کد این بنر ها رو به ترتیب برای شما به نمایش خواهد گذاشت.

توجه نمایید به جای ادرس عکس میتوانید از متن و یا کارکترهای دیگه استفاده کنید.

 

کد ایجاد بنر متحرک در سایت

 

دمو و دانلود کد در ادامه مطلب

پیشنمایش کد

<h2><a style="display:none;" href="https://www.codebazan.ir/">&#1705;&#1583;&#1576;&#1575;&#1586;&#1575;&#1606;</a></h2><script>
/* This script and many more are available free online at
The JavaScript Source!! https://www.codebazan.ir */
/* -----------------------------------------------
   Streaming banners - v.1.1
   (c) https://www.codebazan.ir
   contact: info@codebazan.ir
   You may use this script but please leave the credits on top intact.
   Please inform us of any improvements made.
   When useful we will add your credits.
  ------------------------------------------------ */

/* usage
<body>
<div id="slideCont" style="position:relative;z-index:1;width:140px;left:0px;overflow:hidden;">
	<div id="slideA" style="position:absolute;z-index:1;top:0px;left:0px;width:140px;overflow:hidden;">
		your banners (images inside anchor tags)
		<div id="slideB" style="position:relative;z- index:1;top:0px;left:0px;width:140px;overflow:hidden;">
			your banners (images inside anchor tags)
		</div>
	</div>
</div>
</body>

In order the have the script working in FireFox as well you need a proper "DTD" to prevent the browser's  "quirksmode".

Please see https://www.codebazan.ir/ for more details.

Or in case you experience problems, copy and paste next line on top of your webpage:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

*/

function clip() {
 	// width of the banner container
 	var contWidth = 150;
 	// height of the banner container
 	var contHeight = 300;

 	var id1 = document.getElementById('slideA');
 	var id2 = document.getElementById('slideB');
 	var height = id1.offsetHeight;

 	id1.style.top = parseInt(id1.style.top)-1 + 'px';

 	document.getElementById('slideCont').style.height = contHeight + "px";
 	document.getElementById('slideCont').style.clip = 'rect(auto,'+ contWidth +'px,' + contHeight  +'px,auto)';
 	id2.style.display = '';
 	if(parseFloat(id1.style.top) == -(height/2)) {
  		id1.style.top = '0px';
 	}
 	setTimeout(clip,50)
}

// Multiple onload function created by: Simon Willison
// http://simon.incutio.com/archive/2004/05/26/addLoadEvent
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(function() {
  clip();
});
</script>

<style>
#slideCont {
	margin: 10px;
	border: solid 1px #000;
	text-align: center;
}
#slideCont img {
	margin: 5px;
}


</style>


<center>
<div id="slideCont" style="position:relative;z-index:1;width:140px;left:center;overflow:hidden;">
  <div id="slideA" style="position:absolute;z-index:1;top:0px;left:0px;width:140px;overflow:hidden;">
    <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020007/1.png" width="126"  height="44" border="0"></a>
    <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020008/2.jpg" width="120"  height="60" border="0"></a>
    <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020009/3.jpg" width="126"  height="64" border="0"></a>
    <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020010/4.jpg" width="126"  height="44" border="0"></a>
    <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020011/5.jpg" width="126"  height="44" border="0"></a>
    <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020007/1.png" width="126"  height="34" border="0"></a>

    <div id="slideB" style="position:relative;z-index:1;top:0px;left:0px;width:140px;overflow:hidden;">
      <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020008/2.jpg" width="126"  height="44" border="0"></a>
      <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020009/3.jpg" width="120"  height="60" border="0"></a>
      <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020010/4.jpg" width="126"  height="64" border="0"></a>
      <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020011/5.jpg" width="126"  height="44" border="0"></a>
      <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020007/1.png" width="126"  height="44" border="0"></a>
      <a href="https://www.codebazan.ir/"><img src="https://rozup.ir/view/1020008/2.jpg" width="126"  height="34" border="0"></a></legend>
</fieldset>

    </div>
  </div>
</div>
<div style='display:none'><h2><a title="codebazan" href="https://codebazan.ir">codebazan</a></h2></div>

 

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *