(^16) ❘ CHAPTER 1 INTRODUCTION TO JQUERY
Include All Script in External Documents
Part of making JavaScript nonobtrusive means making JavaScript complementary and supplemental,
rather than required and mandatory. This concept is explored in detail throughout this book; how-
ever, it should be noted why this is the best approach.
Consider the following code example:
<!DOCTYPE HTML>
content="application/xhtml+xml; charset=utf-8" />
onclick="window.open(
'pumpkin.jpg',
'picture',
'scrollbars=no,width=300,height=280,resizable=yes');">
Open Picture
Combine the preceding markup with the following style sheet:
img {
display: block;
margin: 10 px auto;
width: 100 px;
border: 1 px solid rgb( 128 , 128 , 128 );
}
body {
font: 14 px sans-serif;
}
p {
width: 150 px;
text-align: center;
}
The preceding code gives you something like what you see in Figure 1-2.
In Figure 1-2, you see what is probably a common scenario: You have a thumbnail, and you can
click to see a bigger version of the thumbnail. This is the kind of thing that JavaScript works well
for—giving you the bigger version in a separate pop-up window that doesn’t have any controls.
Now examine why what I did in Figure 1-2 was the wrong way to go about adding this
functionality.
[http://www.it-ebooks.info](http://www.it-ebooks.info)