CSS and the Scrollbar
Jazz up your scrollbar with a few CSS color commands.
jburns@htmlgoodies.com
Jazz up your scrollbar with a few CSS color commands.
Use the power of XML to make vector-based images appear in your browser without needing to create them in a graphics program.
Learn how online commerce keeps your credit cards safe.
Post the tables that pop up when the mouse passes over.
This script places links on your page that let your users minimize and maximize your pages. You can specify how small you want the minimized window. This one is for Netscape only.
Build the table that pops up when you mouse over a link.
Create tables that pop up when you mouse over a link.
Here's a quick, fun little script that plays around with Netscape Navigator layers.
Now let's post the numbers to the text box.
Now we need to start building the clock using the actual time.
Now we need to start building the clock using the actual time.
Set up a time zone clock with javascript.
We're in the home stretch with the digital clock script. All we need to do now is set the minutes and seconds.
Today we begin playing around with replacing those image tags with the correct numbers, depending on what time it is.
We're going to continue continue working and improving the function from Script Tip 82.
Now the fun part. Let's get to acting upon those lines of text from the previous script.
This script was sent to me to use as a tip. I really liked it the first time I saw it, so here's the tutorial.
Let's look at the function outside of the script and figure out how it works.
Learn how to create a personal search engine using Perl.
Remove all HTML flags with this nifty little script.
Want to perform math using Perl? Follow a few simple rules to get the correct display.
This primer is dedicated to setting up a date and time script using Perl.
We know about the layer, we understand the loops, now let's put it all together in a function.
The next step in the Perl Primer is learning to make the script post user comments.
In this primer, we'll play with the PERL branching method.
At the end of these primers, you'll know how to grab form data, send and alter email messages, and post and alter virtual HTML pages.
The fourth primer in the PERL Series builds on first three.
PERL Primer two teaches you how to set up file permissions
Introduction and what you need to know in order to start learning Perl.
In the last Script tip, we learned the layer and its properties. Now let's get it to display.
With the click of a button, anyone can make your home page their startup page.
Use JavaScript to get a Layer to scroll across, or onto, your screen. It picks up where Layers Part II leaves off.
It won't stop clever criminals, but by stopping a user's right click you have a better chance keeping your images. Learn how to disable a user's right or left mouse button or to disable the mouse altogether!
If you've ever had trouble writing code for frames, like I do, then this is the script for you.
Here's the basic introduction to layering images (NN 4.0+ required).
Add motion to those layered images (NN 4.0+ required)!
The Spirit of script tips brings you a tutorial on creating a drop-down menu in Netscape Navigator.
This is the third in a string of JavaScript password script tutorials.
It's time for script number two in our run of Script Tips dealing with passwords.
I ran into Matt's Script Archive. It's a great site. He doesn't offer a great number of scripts, but the ones he does have work like a dream.
This is the first in a series of script tips meant to discuss and describe the concept of creating password protection through JavaScript.
Today we wrap this up the headline script.
Learn how to set up a form so that after the user fills in a pre-determined number of characters, the cursor jumps to the next form element all by itself.
To "register" your page is to place it in the database of the search engine. That's what we'll talk about here.
Now that we know which button was clicked and which headline number should be displayed, we need to display what is called and then reset all the values.
Forget setting your pages to fit the user's browser, set the user's browser to fit your pages.
Dynamic HTML is a combination of Style Sheets, Layering, JavaScripts, Divisions, and Positioning that creates movement and interactivity. Get ready for the future!
Learn how to change headlines in the headline-linking script.
Beyond HTML Tutorials
I get letters all the time saying they want to advertise on their home page. I say, Great! How many people are coming in a day? I'm not talking hits mind you, I'm talking visitors.
This is a re-do of the color script so that it will run in Netscape Navigator.
The engine that makes this script run is a simple function named mix(). We'll get into it here.
Now that we understand the concept of color and drop down menus, let's build the table so we can act upon it.
Java is an Object Oriented Programming (OOP) language created by James Gosling of Sun Microsystems. JavaScript was created by the fine people at Netscape. JavaScript is a distant cousin of Java.
Beyond HTML Tutorials
I don't know why, but everyone wants to know how to create these little windows that pop up.
Beyond HTML Tutorials
This is an effect people have been asking for for a long time now. I looked and looked and couldn't find anything on the topic -- so you know what I did? I wrote the script myself. Well, I wrote it and JavaScript wizard Andree Growney made it really work.
Beyond HTML Tutorials
This color script is perfect for Web developers to check colors before writing them into the page.
Ever since I put up the three CGI tutorials I have been getting mail asking what I mean by "telnet into your system." I put this quick lesson together to explain in a bit more detail.
In this case I want the message -Nice to see you- when the user uses the cookie for the first time. I then want the message -Welcome back- each time following.
The cookie is set. Now we need to use coding to go get it.
If a user has come to your page and didn't play nice with this script and allowed it to simply read "Nobody" by hitting return, we should make a point of showing that person the error of their ways and give them a second
But what if this is the person's first time to get the cookie? Then we need to set up code that places it and writes what we want to it. Let's do it.
Whatever you think about cookies, there's no denying they're popular. In this series of Script Tips we'll get into how you can set, and retrieve, cookies for your visitors.
Parse the information from the array and give it to the showChord() function.
Look at the functions of the script that check the radio buttons.
Let's look into how the chords are built into that bank of little radio dots.
Use this Java applet to create your own chat room.
Allows user to click on guitar chord and have chord formed
There's one more thing to worry about in this here calculator script and that is the button that changes numbers from negative to positive.
On to the last line of buttons.
Let's get into the buttons you find past the top row.
Use AltaVista or HotBot as your personal search engine!
Learn to set up a password-protected directory using Active Server Pages.
Everybody loves putting together a great guestbook, and through the use of ASP, you can get that all-important secondary page that pops up right after the user submits.
Now all that is left is to display it.
This will either act as a general, overall direction script or as an internal script that writes items to the page, depending on the user's screen settings.
The down-and-dirty use of Style Sheets to set up text style classes. It's fast and it works.
Put all the commands together and you can create some pretty great forms in MSIE.
If you can put it on your HTML page, you can get any type of border around it!
Colors, images, full and partial page backgrounds, background-repeat, and the watermark -- all here!
We have the image's height, width, and will soon have a new height from the user.
Grab the image's height and width without any input from the viewer.
Add some style to your lists!
Enter height and width of an image to resize. Then enter a new height; the script figures the new width, keeping the same proportions the image original had.
We've set up search URLs and created something that will check the entered text for spaces. Now, we'll do the search.
Today, we look at the code that searches the keywords entered in this script.
People have been writing to me for a while now asking how they can get a Billboard Server or a Newsgroup-type effect. Others want to be able to post the results of their e-mail guestbook without all the hassle. Well, here's the answer.
This script allows searches on many search engines from one page.
Everybody wants a counter on their page. I can understand. I love the look of a counter proclaiming to all that my page is cool enough for a couple hundred thousand to roll through.
In this tutorial I'll do my best to explain how to go about getting your own section of the World Wide Web, and hopefully explain a little bit about how the whole Internet works along the way.
Get to the configuration that allows use across frames
Wouldn't it be better to just let the user choose their selection and off they go... sans button?
Get a button to change colors like the text link above! Here's how.
Pass a mouse over a link and it changes colors! Here's how to do it.
Make a division appear and disappear at will! It's a great effect.
Make a division appear and disappear at will! It's a great effect. Separate pages for MSIE and Netscape.
These note cards move back to front when you click on the tabs. It's a great way to supply your viewers with multiple levels of information!
The function part of this script is what takes the choice the user made and creates a hypertext link to it.
Create a folder tree and allow your viewers to open and close links in a frames format.
Want to lose the underline on your links? Here's how.
Here's a video game where it's you against a UFO...
This tip is a basic drop down link menu.
Now let's get that scroll to show up in a text box.
We have the text that will scroll, now let's get it scrolling.
Non-dithering colors are the colors that always look smooth, without the appearance of dots. Here we present a chart of all 216 non-dithering colors.
Don't make the scrolling text important information. It should act as icing on the cake.
The script uses two arrays and five images to get its effect. The script posts a random banner.
This tutorial is a brief introduction to color theory and hexadecimal color codes
No more Java errors! No more nonscrolling marquees. This script is cross-platform and sends viewers to a specific page, depending on their browser.
Create buttons and links so viewers can bookmark your page with one click!
Cross-Platform Tips for HTML Artists
Readers want to know what can be done with XML. Until now, I didn't have a really good answer, but I think I've found a pretty good use for it.
When someone bookmarks your page, choose the icon that appears in the list! (MSIE 5.0 only)
This is really a clever deal. In this tutorial I'm going to talk about a different way to post information to your page depending on what browser the user is running.
I can usually tell where my readers are surfing. The reason is that often I'll get a letter asking how another site did something spectacular. The latest thing everyone wants is a dual image flip like the one put up on Comedy Central.
Post a date that goes beyond the basic number returns.
Here's a summary of the new commands for HTML 4.0.
Here's a summary of the new subcommands for HTML 4.0.
Now we have all the parts. Let's figure the days.
The main thrust here is to discuss the setTimeout() command.
Grab and alter the minute and second sections of the clock.
JavaScript doesn't simply allow us to present the hours by calling for and then posting the return from the method getHours().
We're good to go with the running digital clock this time around. This is a big, involved piece of code that you'll love.
The function surrounds JavaScript that will open a new window and fill it with text.
Let's go in the complete opposite direction and look at the HTML form elements.
First we grab the user's name and e-mail address and stick them in the subject line of the FORM tag.
Now, we start again with a guestbook script that carries all the bells and whistles.
That little number can be plopped basically anywhere and whatever follows it shows up in the status bar.
This script's main purpose is to write the HTML document's flag to the page so we have to make sure that the entire script sits right where the sits on the HTML page.
This tutorial/essay goes into great depth regarding images in general. BMP, GIF, and JPEG formats are then explained with loads of examples.
Create an transparent image that blends perfectly with your background.
VBScript is a Microsoft original. It's quite close to the earlier version of JavaScript, but still a tried and true Explorer model.
Impress those who can't find what they want on your pages.
Learn how to use Table commands to create a calendar to place on your page.
Learn how to change the color of text, links, and visited links.
Learn how to make your own web ring or attach to one that's already on line.
Explorer offers a very simple text scroll. They call it a Marquee. Here's how you do it.
Instead of using the dull gray submit button, why not use a colorful image to submit your form data? Here's how.
You're surfing along and everything looks okay, but then you look up at the location bar. There's no .html up there. It's new. Instead there's an .asp.Signpost up ahead. You have entered the Active Server Page Zone....
These commands are now supported cross-browser so they are becoming very popular. Set all font size and face commands at once! All your pages read from one template: That's the style sheet.
Give your tables a lift with colored borders.
Create a low-resolution image to appear until your high-resolution image loads up
Use this tutorial to change the background color of your Netscape-based tables. You can create some really awful color combinations, let me tell you....
This is a list of the extra commands Explorer offers over the Netscape browser. Most are extensions of what Netscape can do. They produce more color or allow more manipulation of data.
This is a basic introduction to frames covering the commands and what they do to the browser screen.
How the results of the random number functions get written to the page.
Wondering what this new language is and how it's going to effect the way people write? Let's start looking into it.
The purpose of this series of charts is to give you the ability to check HTML flags, CSS commands, and Script formats against different versions of different browsers. In short, what works with what?
Check Opera HTML Commands
The W3C has set up page design guidelines that you can follow to allow those using disabled assistant browsers to better read your pages. Here are the highlights and some links to get you started.
We're dealing with a random number script or set of scripts (it's actually two).
This script produces a random number between 1 and any number. Set the upper limit within the script.
Discuss setting up variables as the script goes along.
This map works through placing coordinates on the HTML page. Viewers must have a higher level browser to see it work.
This describes the creation of a CGI (Common Gateway Interface) image map. This type of map will work on all browsers.
Look at the browser the user is running and send the user to a specific page.
Look at the browser the user is running and send the user to a specific page.
The central purpose of this browser detection system
Look at a rather small but quite important command, the equal sign.
Now we'll get into the history statement
Let's talk about that confirm statement
Tear a little further into this script in an attempt to better understand it.
We're going to focus on the function in the script.
Posts a dialogue box when a person enters the page.
The last part of the discussion of this basic image flip script
Spend more time looking at how a basic image flip works its magic
Discussion on the use of objects in a hierarchy statement
Create dynamic, changeable pages with meta commands.
Learn to make a cookie and retrieve information about your viewers.
Learn to create a searchable database for your Web page.
Learn all about the use of HTML declaration statements and whether you need one or not.
Make newspaper-like columns on your page.
A series of tips to help you place JavaScript on your HTML pages.
Meta commands don't add anything visually to your page, but they help a great deal when you submit your pages to search engines. Basically, the commands make you very easy to find.
Here's the newest version of HTML so you can understand it.
How does HTML 4.0 affect frame creation? Here's how!
You will be shown how to set up a directory that will only let in those who know the password.
What exactly does that 404 error mean? What about that 412 error and that pesky 501 error? Here are the answers to all your server error questions.
You will be shown how to set up a directory that will only let in those who know the password.
This teaches you how to create an image link that does not produce a hand image when the cursor passes over it. I don't know why you'd use it, but why not tell you about it?
This is an introduction to placing Tables on your Web pages. If you're starting to use tables, start here.
A horizontal rule is a great, and simple, way to break up your page. Here's how.
Place text over your images with HTML commands alone!
Not exactly a chat room -- but just as good. You can have a real-time chat with anyone on the Net, anywhere in the world.
Set up your pages so that the images are in the cache waiting to be used rather than downloading each image as you need it.
Ah, the cursor. Some like the pointing finger, some like that I-beam-looking thing, and others try to lose the cursor altogether. Whatever your cup of tea, CSS version 2.0 is trying to help.
No, you cannot force a browser to print your page, but you do have some control over how it will look when the user does print. Here's the lowdown.
These commands allow you to place images and text exactly where you want them on any browser.
This is without a doubt the number one item people ask me about. Everyone wants a counter. Why? I don't know. My guess is because someone else has one. I don't have a lot of room to talk. I have one, too.
This tutorial explains how to re-size the cells, rows, and columns allowing them to span as far as you want, across as many cells as you want.
Make a 1x1-pixel image to add lines and blocks of color to your pages
This tutorial guides you to download all the software you need, then walks you through creating your first animated gif. Heck, I even provide the first four images.
This is a chart of characters that use ascii characters to create characters in HTML not found on the keyboard.
Use PaintShop Pro to capture any image on your computer's screen.
Learn to make a thumbnail image.
If you follow this tutorial, you will be guided through the steps to place a guestbook CGI onto your system.