Het gebruik van HTML DIV-Box voor een aanwijseffect

Een fundamenteel element van een oog springende webpagina's is het gebruik van HTML-stijlelementen en div-containers. Met hen kunt breken vrij van de beperkingen van de meer traditionele tabelontwerp, en maken van bijna elke visuele lay-out die je je kunt voorstellen. Daarnaast door het gebruik van JavaScript-operatoren, kunt u de stijlen die zijn gekoppeld aan een DIV container wanneer een actie zoals een muisaanwijzer eroverheen wordt gehangen optreedt. Het proces is eenvoudig, dat u hoeft alleen te maken van twee aparte stijl klassen en het plaatsen van een operator in de tag van de container om te schakelen tussen hen.

• Open de webpagina met de DIV container waarvan u de stijl wilt wijzigen in een teksteditor.

• Invoegen van twee nieuwe klassen van de stijl binnen het openen en sluitenTags van uw webpagina. De standaardstijl voor uw DIV container toewijzen en de stijl u wilt hebben als het is zweefde met de muis. Bijvoorbeeld, wordt ervan uitgegaan dat u een DIV container met zwarte tekst die u wijzigen in rood wilt wanneer het is zweefde met de muis. U zou de volgende code invoegen:

  Vervang de klassenamen van uw voorkeur voor defaultDIVstyle en hoverDIVstyle.

• De naam van de standaard-klasse hechten aan de tag voor de DIV container in kwestie. Voor het bovenstaande voorbeeld, zou u de volgende code toevoegen aan de DIV-tag:

  Class = "defaultDIVstyle"

• Koppel een onMouseOver-gebeurtenis aan de DIV container om over te schakelen van de naam van de klasse aan uw hover-stijl, in de volgende notatie:

  onMouseOver="this.classname='hoverDIVstyle"; "

• Koppel een gebeurtenis onMouseOut aan de DIV container om over te schakelen van de klassenaam terug naar de standaardwaarde wanneer de aanwijzer wordt verplaatst weg van het, in de volgende notatie:

  onMouseOut="this.classname='defaultDIVstyle"; "

  Van uw container-div-tag moet nu als volgt gelezen:

• Opslaan en publiceren van uw web-pagina. Uw DIV container zal nu veranderen van zwarte tekst rood wanneer het is zweefde en terugkeren naar zwart wanneer de muisaanwijzer wordt verplaatst weg van het.