Bu Yazımızda Duyuru Panosu Kodu, HTML Duyuru Panosu Kodu, Duyuru Kodu, CSS HTML Duyuru Panosu Kodu, HTML Duyuru Scripti, Sitene Duyuru Panosu Ekle, Duyuru Panosu, Duyuru Panosu Kodu Sitene Ekle, Büyüleyici Duyuru Panosu, Site Duyuru Panoları Detaylar Yazımızda.

Duyuru Panosu Kodları

Duyuru Panoları’nın Örnek Gösterimi Mauseyi Duyuru İconu’na Getirince Açılacaktır.

Duyuru Panosu 1

<!— wWw.Eniyisozler.Net Kod Başlangıcı —>
<div id="menueniyisoz"><div id="eniyisoz-kod"><br/><b>DUYURU</b><br/><br/>
1. Yazıyı Yazınız
<br/><br/>
2. Yazıyı Yazınız
</div></div>
<eniyisoz><style> #menueniyisoz{ position:fixed; bottom:10px; left:10px; width:80px;height:80px; background:transparent url(https://www.eniyisozler.net/Html-images/images/duyuru-2.png) no-repeat center center; transition: all 0.8s ease-in-out; background-size:cover; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; -webkit-transition-timing-function:ease-in-out; } #menueniyisoz:hover{ bottom:35px;left:35px; width:80px;height:80px; transform: rotate(720deg); -ms-transform: rotate(720deg); -webkit-transform: rotate(720deg); }#eniyisoz-kod{position:absolute;bottom:37px;left:38px; box-shadow: -1px 1px 5px 0px #FF0000; transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; line-height:22px; -webkit-transition-timing-function:ease-in-out; opacity:0; width:0px;height:0px; padding:6px;color:#000; font-family:Helvetica, Arial, sans-serif; font-weight:normal; text-decoration:none; font-size:15px; text-align:center; -webkit-border-radius: 8px; -webkit-border-bottom-left-radius: 0; border-radius: 8px; border-bottom-left-radius: 0; }</style><style> #menueniyisoz:hover #eniyisoz-kod{ width:200px;height:250px; background:#E58B1A; opacity:0.6;} </style></eniyisoz>
<!— wWw.Eniyisozler.Net Kod Sonu —>

Duyuru Panosu 2

<!— wWw.Eniyisozler.Net Kod Başlangıcı —>
<div id="menueniyisoz"><div id="eniyisoz-kod"><br/><b>DUYURU</b><br/><br/>
1. Yazıyı Yazınız
<br/><br/>
2. Yazıyı Yazınız
</div></div>
<eniyisoz><style> #menueniyisoz{ position:fixed; bottom:10px; left:10px; width:150px;height:80px; background:transparent url(https://www.eniyisozler.net/Html-images/images/duyuru-3.png) no-repeat center center; transition: all 0.8s ease-in-out; background-size:cover; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; -webkit-transition-timing-function:ease-in-out; } #menueniyisoz:hover{ bottom:35px;left:35px; width:150px;height:80px; transform: rotate(720deg); -ms-transform: rotate(720deg); -webkit-transform: rotate(720deg); }#eniyisoz-kod{position:absolute;bottom:37px;left:38px; box-shadow: -1px 1px 5px 0px #000000; transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; line-height:22px; -webkit-transition-timing-function:ease-in-out; opacity:0; width:0px;height:0px; padding:6px;color:#fff; font-family:Helvetica, Arial, sans-serif; font-weight:normal; text-decoration:none; font-size:15px; text-align:center; -webkit-border-radius: 8px; -webkit-border-bottom-left-radius: 0; border-radius: 8px; border-bottom-left-radius: 0; }</style><style> #menueniyisoz:hover #eniyisoz-kod{ width:200px;height:250px; background:#FF0000; opacity:0.6;} </style></eniyisoz>
<!— wWw.Eniyisozler.Net Kod Sonu —>

Duyuru Panosu 3

<!— wWw.Eniyisozler.Net Kod Başlangıcı —>
<div id="menueniyisoz"><div id="eniyisoz-kod"><br/><b>DUYURU</b><br/><br/>
1. Yazıyı Yazınız
<br/><br/>
2. Yazıyı Yazınız
</div></div>
<eniyisoz><style> #menueniyisoz{ position:fixed; bottom:10px; left:10px; width:80px;height:80px; background:transparent url(https://www.eniyisozler.net/Html-images/images/duyuru-4.png) no-repeat center center; transition: all 0.8s ease-in-out; background-size:cover; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; -webkit-transition-timing-function:ease-in-out; } #menueniyisoz:hover{ bottom:35px;left:35px; width:80px;height:80px; transform: rotate(720deg); -ms-transform: rotate(720deg); -webkit-transform: rotate(720deg); }#eniyisoz-kod{position:absolute;bottom:37px;left:38px; box-shadow: -1px 1px 5px 0px #FF0000; transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; line-height:22px; -webkit-transition-timing-function:ease-in-out; opacity:0; width:0px;height:0px; padding:6px;color:#000; font-family:Helvetica, Arial, sans-serif; font-weight:normal; text-decoration:none; font-size:15px; text-align:center; -webkit-border-radius: 8px; -webkit-border-bottom-left-radius: 0; border-radius: 8px; border-bottom-left-radius: 0; }</style><style> #menueniyisoz:hover #eniyisoz-kod{ width:200px;height:250px; background:#E58B1A; opacity:0.6;} </style></eniyisoz>
<!— wWw.Eniyisozler.Net Kod Sonu —>

Duyuru Panosu 4

<!— wWw.Eniyisozler.Net Kod Başlangıcı —>
<div id="menueniyisoz"><div id="eniyisoz-kod"><br/><b>DUYURU</b><br/><br/>
1. Yazıyı Yazınız
<br/><br/>
2. Yazıyı Yazınız
</div></div>
<eniyisoz><style> #menueniyisoz{ position:fixed; bottom:10px; left:10px; width:80px;height:80px; background:transparent url(https://www.eniyisozler.net/Html-images/images/duyuru.png) no-repeat center center; transition: all 0.8s ease-in-out; background-size:cover; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; -webkit-transition-timing-function:ease-in-out; } #menueniyisoz:hover{ bottom:35px;left:35px; width:80px;height:80px; transform: rotate(720deg); -ms-transform: rotate(720deg); -webkit-transform: rotate(720deg); }#eniyisoz-kod{position:absolute;bottom:37px;left:38px; box-shadow: -1px 1px 5px 0px #888888; transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; line-height:22px; -webkit-transition-timing-function:ease-in-out; opacity:0; width:0px;height:0px; padding:6px;color:#fff; font-family:Helvetica, Arial, sans-serif; font-weight:normal; text-decoration:none; font-size:15px; text-align:center; -webkit-border-radius: 8px; -webkit-border-bottom-left-radius: 0; border-radius: 8px; border-bottom-left-radius: 0; }</style><style> #menueniyisoz:hover #eniyisoz-kod{ width:200px;height:250px; background:#444; opacity:0.6;} </style></eniyisoz>
<!— wWw.Eniyisozler.Net Kod Sonu —>

Duyuru Panosu 5

<!— wWw.Eniyisozler.Net Kod Başlangıcı —>
<link rel="stylesheet" media="screen, print, handheld" type="text/css" href="https://www.eniyisozler.net/Html-Kodlari/duyuru-panosu-ekle-7.css">
<div class="css3droppanel">
<input type="checkbox" id="paneltoggle" />
<label for="paneltoggle"></label>
<div class="content">
<font size="4" color="#333333">
<p>
EniyiSozler.Net<br><br>
Sitemize Hoşgeldiniz. HTML Kod Arşivine Baktınız mı? Haydi Sizde Sitenize Duyuru Panosu Ekleyin.
<br><br>
Güzel Sözler ve Blog Sitesi. <br><br>
Güzel Sözler, Mesajlar, Yemek Tarifleri, Şiirler, Burçlar, Burç Uyumları, Emojiler, Resimli Sözler, Fıkralar, Sağlık, Moda, Bayanlara Özel, Cinsellik, HTML Kodları Gibi Sizlere Küçük Ama Etkili Önerileri Sitemizde Bulabilirsiniz. 
</p>
</font>
</div>
</div>
<!— wWw.Eniyisozler.Net Kod Sonu —>

Duyuru Panosu 6

<!— wWw.Eniyisozler.Net Kod Başlangıcı —>
<script type="text/javascript">
 
var delay = 2000; 
var maxsteps=30; 
var stepdelay=40; 
 
var startcolor= new Array(255,255,255); 
var endcolor=new Array(0,0,0);
 
var fcontent=new Array();
begintag='<div style="font: normal 14px Arial; padding: 5px;">'; 
fcontent[0]="<b>EniyiSozler.Net</b> EniyiSozler.Net Sitemize Hoşgeldiniz";
fcontent[1]="<b>EniyiSozler.Net</b> HTML Kod Arşivine Baktınız mı? Haydi Sizde Sitenize Ekleyin.";
fcontent[2]="<b>EniyiSozler.Net</b> Güzel Sözler ve Blog Sitesi.";
closetag='</div>';
 
var fwidth='200px'; 
var fheight='100px'; 
 
var fadelinks=1;  
 
var ie4=document.all&amp;&amp;!document.getElementById;
var DOM2=document.getElementById;
var faderdelay=0;
var index=0;
 
function changecontent(){
  if (index>=fcontent.length)
    index=0
  if (DOM2){
    document.getElementById("fscroller").style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
    document.getElementById("fscroller").innerHTML=begintag+fcontent[index]+closetag
    if (fadelinks)
      linkcolorchange(1);
    colorfade(1, 15);
  }
  else if (ie4)
    document.all.fscroller.innerHTML=begintag+fcontent[index]+closetag;
  index++
}
 
function linkcolorchange(step){
  var obj=document.getElementById("fscroller").getElementsByTagName("A");
  if (obj.length>0){
    for (i=0;i<obj.length;i++)
      obj[i].style.color=getstepcolor(step);
  }
}
 
 
var fadecounter;
function colorfade(step) {
  if(step<=maxsteps) {   
    document.getElementById("fscroller").style.color=getstepcolor(step);
    if (fadelinks)
      linkcolorchange(step);
    step++;
    fadecounter=setTimeout("colorfade("+step+")",stepdelay);
  }else{
    clearTimeout(fadecounter);
    document.getElementById("fscroller").style.color="rgb("+endcolor[0]+", "+endcolor[1]+", "+endcolor[2]+")";
    setTimeout("changecontent()", delay);
    
  }   
}
 
function getstepcolor(step) {
  var diff
  var newcolor=new Array(3);
  for(var i=0;i<3;i++) {
    diff = (startcolor[i]-endcolor[i]);
    if(diff > 0) {
      newcolor[i] = startcolor[i]-(Math.round((diff/maxsteps))*step);
    } else {
      newcolor[i] = startcolor[i]+(Math.round((Math.abs(diff)/maxsteps))*step);
    }
  }
  return ("rgb(" + newcolor[0] + ", " + newcolor[1] + ", " + newcolor[2] + ")");
}
 
if (ie4||DOM2)
  document.write('<div id="fscroller" style="border:1px solid black;width:'+fwidth+';height:'+fheight+'"></div>');
 
if (window.addEventListener)
window.addEventListener("load", changecontent, false)
else if (window.attachEvent)
window.attachEvent("onload", changecontent)
else if (document.getElementById)
window.onload=changecontent
 
</script>
<!— wWw.Eniyisozler.Net Kod Sonu —>

Duyuru Panosu 7

<!— wWw.Eniyisozler.Net Kod Başlangıcı —>
<div id="marqueecontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">
<div id="vmarquee" style="position: absolute; width: 98%;">
<h4><a href="https://www.eniyisozler.net/"><b>EniyiSozler.Net</b></a></h4>
<h4><b>Sitemize Hoşgeldiniz</b></h4>
<h4><b>HTML Kod Arşivine Baktınız mı?</b></h4>
<h4><b>Haydi Sizde Sitenize Ekleyin.</b></h4>
<h4><b>Güzel Sözler ve Blog Sitesi.</b></h4>
<h4><b>Ve Dahası Eniyisozler.Net'te</b></h4>
 
</div>
</div>
 
<style type="text/css">
 
#marqueecontainer{
position: relative;
width: 200px;
height: 200px; 
background-color: #FFF;
overflow: hidden;
border: 3px solid red;
padding: 2px;
padding-left: 4px;
color:#000;
font-size:13px;
}
 
</style>
<script type="text/javascript">
 
var delayb4scroll=2000
var marqueespeed=2 
var pauseit=1 
 
var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var actualheight=''
 
function scrollmarquee(){
if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px"
else
cross_marquee.style.top=parseInt(marqueeheight)+8+"px"
}
 
function initializemarquee(){
cross_marquee=document.getElementById("vmarquee")
cross_marquee.style.top=0
marqueeheight=document.getElementById("marqueecontainer").offsetHeight
actualheight=cross_marquee.offsetHeight
if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ 
cross_marquee.style.height=marqueeheight+"px"
cross_marquee.style.overflow="scroll"
return
}
setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll)
}
 
if (window.addEventListener)
window.addEventListener("load", initializemarquee, false)
else if (window.attachEvent)
window.attachEvent("onload", initializemarquee)
else if (document.getElementById)
window.onload=initializemarquee
 
</script>
<!— wWw.Eniyisozler.Net Kod Sonu —>