📄 foo
字号:
<HEAD>
<TITLE>Netprog 2001 Stupid JavaScript Tricks</TITLE>
<STYLE>
span.but { background-color: #80FF80;
color:black;
font-family:sans-serif;
font-size:12pt;
font-weight:bold;
}
A:link,A:visited { color: white; background-color: purple;text-decoration: none; }
H3 { text-align: left; font-family: sans-serif; color:purple; }
</STYLE>
</HEAD>
<BODY>
<H2 ALIGN=CENTER>EIW 2000 - Stupid JavaScript Tricks</H2>
<HR>
<CENTER><EM>These aren't all supid tricks - some are actually
useful...</EM></CENTER>
<P>
<CENTER><TABLE BORDER=0 CELLPADDING=5 WIDTH=80%>
<TR><TD><H3 ALIGN=CENTER>User Selectable Background Color    
<SPAN class=but><A HREF=background.html>demo</A></SPAN>    
<SPAN class=but><A HREF=background_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">Event handlers (in this case button <CODE>onClick</CODE> handlers)
can change the document background color.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>Active Bullets (Mouseover Images)    
<SPAN class=but><A HREF=activebullet.html>demo</A></SPAN>    
<SPAN class=but><A HREF=activebullet_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">You can use images as linked bullets and have the image change when the
user moves the mouse over the image. The general idea is to use
the <CODE>onMouseOver</CODE> and <CODE>onMouseOut</CODE> events to
switch the <CODE>SRC</CODE> attribute of an image.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>Netscape Layers    
<SPAN class=but><A HREF=layers.html>demo</A></SPAN>    
<SPAN class=but><A HREF=layers_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">Netscape supports HTML layers (IE does not!). You can turn on an off
individual layers in response to user actions.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>DIVS instead of Layers (works on both IE and Netscape).    
<SPAN class=but><A HREF=divs.html>demo</A></SPAN>    
<SPAN class=but><A HREF=divs_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">Same idea as the layers demo, but this one uses DIV tags and includes
JavaScript that will work for either
Netscape or IE.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>Move the Browser    
<SPAN class=but><A HREF=windowjump.html>demo</A></SPAN>    
<SPAN class=but><A HREF=windowjump_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">You can use the <CODE>navigator</CODE> object to alter browser attributes
include the window size and the position of the browser on your screen.
The example works with both IE and Netscape, although IE doesn't seem to
let JavaScript change the window size.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>Moving Cookie Game    
<SPAN class=but><A HREF=cookie.html>demo</A></SPAN>    
<SPAN class=but><A HREF=cookie_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">A complete game (OK, a simple silly game) written in JavaScript.
This script uses:
<UL>
<LI> the JavaScript function <CODE>setTimeout</CODE>
to schedule a subroutine call a short time in the future.
<LI>Button event handlers
<LI>Text Input event handlers
<LI>a DIV - to move an image around in the browser window.
</UL>
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>Popup Window    
<SPAN class=but><A HREF=popup.html>demo</A></SPAN>    
<SPAN class=but><A HREF=popup_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">How to use JavaScript to create those annoying popup windows
containing advertisements.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>JavaScript Object Property Lists    
<SPAN class=but><A HREF=props.html>demo</A></SPAN>    
<SPAN class=but><A HREF=props_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">Using JavaScript you can access and alter object properties, including some
properties of the document. The example here generates a list of
all the properties of the object <CODE>document</CODE>.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>Using a SELECT as a Menu    
<SPAN class=but><A HREF=select.html>demo</A></SPAN>    
<SPAN class=but><A HREF=select_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">You can turn a <CODE>SELECT</CODE> form element in to a menu. Once the
user selects a new menu item - the browser takes action immediately
(it's not necessary for the user to press a "go" or "submit" button).
The example includes two selects, one changes a form field value
and the other jumps to another JavaScript demo.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>JavaScript Generated BACK hyperlink    
<SPAN class=but><A HREF=backbutton.html>demo</A></SPAN>    
<SPAN class=but><A HREF=backbutton_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">An example of using JavaScript to generate a document footer including
a BACK hyperlink.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>JavaScript Mortgage Calculator    
<SPAN class=but><A HREF=calc.html>demo</A></SPAN>    
<SPAN class=but><A HREF=calc_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">You can write interactive calculators using JavaScript.
</P></TD></TR>
<TR><TD ><HR></TD></TR><TR><TD><H3 ALIGN=CENTER>Rubber Window    
<SPAN class=but><A HREF=rubber.html>demo</A></SPAN>    
<SPAN class=but><A HREF=rubber_source.html>source</A></SPAN></H3>
<P style="font-family:sans-serif; font-size:12pt;">You can try to change the window size, but it keeps coming, and coming, and ...
</P></TD></TR>
<TR><TD ><HR></TD></TR></TABLE></CENTER>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -