Viewing Someone Else's Source

Do you ever see some feature on someone else's web page and think "I wish I knew how they did that?"

Finding out the answer can be relatively easy because with all web pages using HTML, javascript, and CSS have their source available on your computer for you to view it and see how it was done.

You can view most source code directly by selecting the appropriate option from the View menu on your browser menu bar. The option that you are looking for is called Source in Internet Explorer, Page Source in Netscape, and Source in Opera. Opera also has a second option called Frame Source which will view the source of a specific frame rather than the frameset. Other browsers should have similar options available.

So what do you do if the frame whose source you want to look at is contained in a frameset and you don't have Opera, or the source you want to look at is contained in an external file. Well you can usually find the reference to the frame or external file that you want to view in the file that you are viewing and by typing its name in the address bar of your browser, you can display that particular source or in some instances, you are given the option to download it to your computer instead.

To get the address of the filename that you want, look for a src= or href= parameter on the frame, script, or link tag. If this is an absolute address starting with http:// then that is its full address. If just a filename is specified then remove everything after the last / in the current page's address and add the filename there. If sub-directories are specified on the front of the filename remove everything back one further / in the current page address for each ../ specified first and then add whatever follows the last ../ to the end of what is left of the current page address.

What happens if there is code in a frame to stop it from being able to be opened separately or you can't figure out the code sufficiently and want to take a copy for later examination? Well within the File menu of each browser there are one or two options that will allow you to save the current page including the referenced external files and images. In Internet Explorer you have the Save As option, in Netscape you have a choice between Save As and Save Frame As, and in Opera you can choose between Save As and Save With Images As. In each case the current page complete with all attached external files and images (assuming you chose the right one of the options where two choices are available) will be saved to your hard disk where you can study the file contents so as to determine just how that feature that you liked so much was achieved.

Note that code of more than one or two statements is probably subject to copyright so while you can look at the page and see how the effect was achieved in order to write your own routine to perform a similar function, you do not have the right to just steal the code in order to incorporate the same effect into your page.


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow