Click to return to the DHTML, HTML     
Web Workshop  |  DHTML, HTML & CSS

A Quote Engine

Using VBScript and floating frames to display a random quote on your page

Robert Hess
Developer Relations Group
Microsoft Corporation

January 10, 1997

Quotes, fortunes, trivia, and tips. Long before widespread use of the Web, people wrote creative applications that generated random tidbits of information and presented them to the user. Although usually not critical to the function of the application or system, these tidbits provided diversions and sometimes a bit of humor.

Early on in the advent of Web pages, people converted these tools into a format that enables a Web page to display selections from random messages to users. With Microsoft Internet Explorer version 3.0, you can combine two separate features and easily implement this functionality in a totally client-side solution. Using a client-side scripting language to generate the message (Visual Basic® Scripting Edition, or VBScript, in this case) and floating frames to provide the visual implementation, it is easy to seamlessly incorporate a constantly changing message into your Web page. The message even changes when the user moves off the page and back onto it, without hitting the server again for an update.

You can implement this engine in a two-stage process. First, you need to create the "generator" code. My version looks similar to this:

<html>
<body bgcolor="#EEEEFF" topmargin=0 leftmargin=0>
<script language="vbs">
<!--
DIM Q(100)
lowerbound=0
i=lowerbound
Q(i)="Exercise daily. Eat wisely. Die anyway.@Unknown" i=i+1 Q(i)="I am at two with nature.@Woody Alan" i=i+1 Q(i)="Familiarity breeds children.@Mark Twain" i=i+1 Q(i)="A dork is a dork is a dork.@Judy Markey" i=i+1 Q(i)="Gravity isn't easy, but it's the law.@Unknown"
upperbound=i Randomize() pick = Int((upperbound - lowerbound + 1) * Rnd + lowerbound)
FullQuote = Q(pick) at=InStr(Q(pick), "@") quote = Left(Q(pick), at-1) author= Mid (Q(pick), at+1) document.write "<table bgcolor=""#CCCCFF""><tr><td>" document.write "<font face=arial><b>" document.write quote document.write "</b></font></td></tr><td align=right><i>- " document.write author document.write "</i></td></tr></table>" --> </script> </body> </html>

The basic steps are as follows:

  1. Include the quotes in a VBScript data array.
  2. Randomly select one of the quotes.
  3. Parse the string down to its separate visual components.
  4. Use the document.write method to insert HTML into the current data stream.

This creates the master quote engine that you can easily include on any page. The code I used on this page looks similar to the following:

<html>
<head><title>Quote Server
Example</title></head>
<body bgcolor="#EEEEFF">
<table><tr><td>
<H1>Quote Server</H1>
<H3>Using VBScript and floating frames to display a random
quote on your page</H3>
</td><td>
<iframe src="quotes.htm" width=300 height=100 frameborder=0
scolling=no>
<table width=300 height=100
bgcolor="#CCCCFF"><tr><td>
<font face=Verdana,Arial><b>
This page really does work best if you are using Internet Explorer
version 3.0
</b></font></td></tr><td align=right>
<A HREF="http://www.microsoft.com/ie/default.asp">
<IMG SRC="/gifs/ie.gif" WIDTH=88 HEIGHT=31 BORDER=0
ALIGN=LEFT></A>
<i>- Robert Hess
</i></td></tr></table>
</iframe>
</td></tr></table>

This illustrates that all you need to do is reference your quote engine in a floating frame to include it on your page.

Note that code within the <IFRAME> </IFRAME> container displays only in browsers that don't support the <IFRAME> tag.



Back to topBack to top

Did you find this material useful? Gripes? Compliments? Suggestions for other articles? Write us!

© 1999 Microsoft Corporation. All rights reserved. Terms of use.