Konuyu Oyla:
  • Derecelendirme: 3.3/5 - 10 oy
  • 1
  • 2
  • 3
  • 4
  • 5
Css Açıklamalı Link
#1
Css özelliğini kullanarak, web bloglarınızda link‘in üzerine gelince, web sitenizin sağ en alt’a duruyu kutusu çıkıyor. Bu özellik aslında bizim için çokta işe yarayabiliyor. Özellikle; linklerin üzerine açıklamalar yazıp uzun uzun satırların oluşmasına sebep oluyordu.

Bu özellik sayesinde bu kadar uğraşıma gerek kalmıyacaktır. Kısa bir yazı üzerine link verdiğiniz taktirde, web sitenizin sağ en alta duyuru panosu şeklinde görülüp link hakkında bilgi verebileceksiniz.

Hem sizi uzun uzun satırlardan kurtarmış oluyor hemde sitenizin daha da şık ve modern+ gösteriyor (: Bütün platformlarda çalışır mı demiyorum ama denemekte fayda var diyorum (:

Hemen nasıl kuracak ve kullanacaksınız anlatayım…

Duyuru şeklinde ki bu kutuyu göstermek için, “Css” ve “Html” e ihtiyacımız var. İlk olarak, bunu sitenizde gösterebilmeniz için, link‘in üzerine imleç ile geldikten sonra sağ en alta görünür olucaktır.

Css (.css Dosyasına Yerleştirin )

Kod:
<pre><em id="__mceDel">#dhtmlfloatie{
position: absolute;
left: 0;
left: -900px;
filter:alpha(opacity=0);
-moz-opacity:0;
border: 2px solid black;
padding: 5px;
z-index: 100;
}

Html ( Açıklamalı Link’in Nerde Gözükmesini İstiyorsanız Oraya Ekleyin)

Kod:
<pre><em id="__mceDel"><script type="text/javascript">
var floattext=new Array()
floattext[0]='- <a href="http://cyberizm.org/">KuraLsız</a><br>- <a href="http://cyberizm.org/">KuraLsız</a><br>- <a href="http://cyberizm.org/">KuraLsız</a><br>- <a href="http://cyberizm.org/">KuraLsız</a><br><div align="right"><a href="javascript:hidefloatie()">Kapat</a></div>'
floattext[1]='Some other floatie text'

var floatiewidth="250px" //default width of floatie in px
var floatieheight="60px" //default height of floatie in px. Set to "" to let floatie content dictate height.
var floatiebgcolor="lightyellow" //default bgcolor of floatie
var fadespeed=70 //speed of fade (5 or above). Smaller=faster.

var baseopacity=0
function slowhigh(which2){
imgobj=which2
browserdetect=which2.filters? "ie" : typeof which2.style.MozOpacity=="string"? "mozilla" : ""
instantset(baseopacity)
highlighting=setInterval("gradualfade(imgobj)",fadespeed)
}

function instantset(degree){
cleartimer()
if (browserdetect=="mozilla")
imgobj.style.MozOpacity=degree/100
else if (browserdetect=="ie")
imgobj.filters.alpha.opacity=degree
}

function cleartimer(){
if (window.highlighting) clearInterval(highlighting)
}

function gradualfade(cur2){
if (browserdetect=="mozilla" && cur2.style.MozOpacity<1)
cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.1, 0.99)
else if (browserdetect=="ie" && cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=10
else if (window.highlighting)
clearInterval(highlighting)
}

function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function paramexists(what){
return(typeof what!="undefined" && what!="")
}

function showfloatie(thetext, e, optbgColor, optWidth, optHeight){
var dsocx=(window.pageXOffset)? pageXOffset: ietruebody().scrollLeft;
var dsocy=(window.pageYOffset)? pageYOffset : ietruebody().scrollTop;
var floatobj=document.getElementById("dhtmlfloatie")
floatobj.style.left="-900px"
floatobj.style.display="block"
floatobj.style.backgroundColor=paramexists(optbgColor)? optbgColor : floatiebgcolor
floatobj.style.width=paramexists(optWidth)? optWidth+"px" : floatiewidth
floatobj.style.height=paramexists(optHeight)? optHeight+"px" : floatieheight!=""? floatieheight : ""
floatobj.innerHTML=thetext
var floatWidth=floatobj.offsetWidth>0? floatobj.offsetWidth : floatobj.style.width
var floatHeight=floatobj.offsetHeight>0? floatobj.offsetHeight : floatobj.style.width
var winWidth=document.all&&!window.opera? ietruebody().clientWidth : window.innerWidth-20
var winHeight=document.all&&!window.opera? ietruebody().clientHeight : window.innerHeight
e=window.event? window.event : e
floatobj.style.left=dsocx+winWidth-floatWidth-5+"px"
if (e.clientX>winWidth-floatWidth && e.clientY+20>winHeight-floatHeight)
floatobj.style.top=dsocy+5+"px"
else
floatobj.style.top=dsocy+winHeight-floatHeight-5+"px"
slowhigh(floatobj)
}

function hidefloatie(){
var floatobj=document.getElementById("dhtmlfloatie")
floatobj.style.display="none"
}

</script>
<div id="dhtmlfloatie">&nbsp;</div>
<a onMouseout="hidefloatie()" onMouseover="showfloatie('cyberizm.org / Bu Bölüme Duyuru,Tanitim,Mesaj Gelebilir', event)" href="#">KuraLsız;</a> | <a onMouseover="showfloatie(floattext[0], event, '#D9FFD9', 250, 100)" href="#">KuraLsız;</a><br />
Beğenenler:
#2
eline sağlık
İnsɑnlɑr değişmez değişen tek şey şɑrtlɑr ve çıkɑrlɑr...
Beğenenler:
#3
teşekkürler
Beğenenler:
#4
Saolasın Bro kiss
Beğenenler:
#5
Eline saglik
Beğenenler:

Anahtar Kelimeler

Css Açıklamalı Link indir, Css Açıklamalı Link Videosu, Css Açıklamalı Link Online izle, Css Açıklamalı Link Bedava indir, Css Açıklamalı Link Yükle, Css Açıklamalı Link Hakkında, Css Açıklamalı Link Nedir, Css Açıklamalı Link Free indir, Css Açıklamalı Link Oyunu, Css Açıklamalı Link Download


1 Ziyaretçi