Jumat, 16 Januari 2026

Membuat Tooltiptext menggunakan HTML MARQUEE

<html>

<head>

<title>SMA INFORMATIKA CIAMIS</title>


<style>

.Normal {

  font-Family: Verdana;

  font-Size: 12;

  color:white;

}

.Notes {

  font-Family: Verdana;

  font-Size: 12;

  font-Style: "italic";

  color:yellow;

}

.Title {

  font-Family: Verdana;

  font-Size: 24;

  font-Weight: 700;

  color:cyan;

}

.Tooltip {

  behavior:url(tooltip.sct);

}


</style>

</head>


<body BACKGROUND="DX_bknd.gif">


<span class="Title">ToolTipText ini dibuat menggunakan HTML MARQUEE</span><br>

<span class="Notes">This code is adapted from the Xxxx Scriptlet presented in the January 1998 installment of Cutting Edge.</span>

<hr>


<p class="Normal">Give your preference to the finest programming magazine:</font> </p>

<div align="center"><center>


<table border="0">

    <tr>

        <td style="background-color:white; border:1px solid blue; padding:2"><img class="tooltip" src="buatbanner.PNG" width="500" height="60" 

                 tip="<marquee>SMA INFORMATIKA CIAMIS - Pemrograman HTML</marquee>"></td></tr>

<tr>

        <td><input type="button" style="font:x-large;color:blue;font-weight:bold"  class="tooltip" value="SPMB2026" 

                 tip="<marquee>Daftarkan diri Anda sekarang juga ke SMA INFORMATIKA CIAMIS!</marquee>"></td>

    </tr>

</table>

</center></div>


</body>

</html>

=======================================
tooltip.sct
<?scriptlet error="yes"?>

<scriptlet id="tooltip">
<implements id="Auto" type="Automation">
   <property name="tip"/>
</implements>

<implements id="Behavior" type="Behavior" default>
</implements>

<script language="JScript">

attachEvent("onmouseover", event_onmouseover);
attachEvent("onmouseout",  event_onmouseout);

var coll = Behavior.document.all("TipText");
if(coll == null) {
  document.body.insertAdjacentHTML ("AfterBegin", 
           "<span id=TipText \
                  style=position:absolute \
                  display:none></span>");
}

function event_onmouseover() {
  ShowTip();
}

function event_onmouseout() {
  HideTip();  
}

function ShowTip() {
  elem = Behavior.document.all("TipText");
  elem.innerHTML = tip;
  elem.style.posTop = window.event.y + 5;
  elem.style.posLeft = window.event.x;
  elem.style.backgroundColor = "FAFAF0";
  elem.style.fontFamily = "verdana";
  elem.style.fontSize = "20";
  elem.style.fontWeight="bold";
  elem.style.width = 200;
  elem.style.borderWidth = "1px";
  elem.style.borderColor = "orange";
  elem.style.height = 26;
  elem.style.padding = 4;
  elem.style.display = "";
}

function HideTip() {
  elem = document.all("TipText");
  elem.style.display = "none";
}

</script>
</scriptlet>

 

Tidak ada komentar: