untitled

(John Hannent) #1
p {font-size: 8px; color: pink;}

</style>

</head>
<body>

<h1 onmouseover=”newrule(‘p’,’font-size: 18px; color:
blue’)”>Hover here to drop

text</h1>

<p>
For small programming jobs, scripting works just fine.
Scripting is programming, albeit with a somewhat
abbreviated language. Scripting is designed to get
past firewalls, browser security settings, and
other security measures.
</p>

</body>

</html>

In this example, when the user hovers the mouse over the headline, the user
triggers this onmouseoverevent:


<h1 onmouseover=”newrule(‘p’,’font-size: 18px; color:
blue’)”>Hover here to drop

This causes the newrulefunction to do its job. The items within the paren-
theses are sent by the computer to the function. First, the pis sent, identify-
ing the selector you want to change. Then the properties and values are sent
to the function as well. You can send as many as you want to send. You don’t
need to send the same number of properties as are currently in the selector’s
style definition.


The function then carries out its one job:


document.styleSheets.thestyles.addRule(selector,specs)

This changes the “rule” (to this selector, changing these properties) in this
document’s style sheets collection. Use the particular style element with the
ID thestyles.


Chapter 16: Programmatic CSS 289

Free download pdf