Script

2006-03-21

Dynamisk CSS

DHTML

Välj en style från CSS dynamiskt

<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<title>Object Model</title>
<style type="text/css">
.bigText   { font-size: 3em; font-weight: bold }
.smallText { font-size: .75em }
</style>
<script type = "text/javascript">
function start() {
    var inputClass = prompt("Enter a className for the text (bigText or smallText)", "");
    pText.className = inputClass;
}
</script>
</head>
<body onload="start()">
<p id="pText">Welcome to our Web site!</p>
</body>
</html>

2006-03-20

Nästade loopar

Javascript

Bryt dej ur en loop ut med break och continue till en label

<script type = "text/javascript">
stop: {   // labeled compound statement
    for (var row = 1; row <= 10; ++row) {
        for (var column = 1; column <= 5 ; ++column) {
            if (row == 5) {
                break stop; // jump to end of stop block
            }
            document.write("* ");
        }
        document.writeln("<br />");
    }
    document.writeln( "This line should not print" );
}
document.writeln( "End of script" );

nextRow:   // target label of continue statement
for (var row = 1; row <= 5; ++row) {
    document.writeln("<br />");
    for (var column = 1; column <= 10; ++column ) {
        if (column > row) {
            continue nextRow; // next iteration of labeled loop
        }
        document.write("* ");
    }
}
</script>

2006-03-20

Boxmodellen

Css

Fixa layouten med float

<div style="float:right; margin-left: .5em; padding: .5em; width:50%; background-color:#f96">
ROSiRO Web Manager is a perfect tool for you to build and maintain your site</div>

<p style="text-align:justify; line-height:1.4em">ROSiRO Inc. is an internationally  recognized
corporate training and publishing organization  specializing in programming languages,
Internet/World Wide Web technology and object technology education. The company provides courses
on Internet and World Wide Web programming.</p>

2006-03-20

Rullningslister med CSS

Css

Fixa en scrollbar frame mitt på sidan

<div style="width:150px; height:100px; overflow:scroll">
This box is only 150 px wide and 100 px high. What do we do if it overflows? Set the overflow property to scroll</div>

2006-03-20

Slumptal

Javascript

Formel för slumptal

// Ex mellan 1 - 6:
value = Math.floor( 1 + Math.random() * 6 );