Floating Email-This-Link

JavaScriptSource Staff Jun 7, 2004

This script displays a floating layer that moves with the page, which contains an "email-this-link" script. The e-mail script automatically captures the URL of the page and opens up your e- mail with all the pertinent information.

tag. // Set the following two position parameters // Negative numbers are relative to right (hX) or bottom (vY) // Positive numbers are relative to left (hX) or (vY) top // Experiment with values to get positioning exact, and allow // for the dimensions of the image & form in the positioning var hX = 340; var vY = -140;

The JavaScript Source: Page Details: Floating Email-This-Link

Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Command-s). The script is yours!!!

<!-- ONE STEP TO INSTALL FLOATING EMAIL-THIS-LINK:

1.  Copy the coding into the BODY of your HTML document  -->

<BODY>

// Insert the entire script just before the </body> tag.
// Set the following two position parameters
// Negative numbers are relative to right (hX) or bottom (vY)
// Positive numbers are relative to left (hX) or (vY) top
// Experiment with values to get positioning exact, and allow
// for the dimensions of the image & form in the positioning

var hX = 340;
var vY = -140;

</script>

<div id="FloatMail" style="position: absolute;
                           background-color: #000000;
                           background-image:url('float_dots.gif');
                           width: 180px;
                           border-width: 2;
                           border-style:outset;
                           border-color:#444444;
                           padding:5px">
<center>
<form name="eMailer">
<font size="2" face="Verdana,Arial" color="#ff0056">
E-Mail This Link
<br>
Enter recipient's e-mail:
</font>
<br>
<input type="text" name="address" size="20"
style="background-color:#000000;
       color:#05fa9e;
       border-color:#ff0000;
       border-width:1;
       border-style:dashed;
       margin-top:7px;"><br>
<input type="button" value="Send this URL" onClick="mailThisUrl();"
style="color:#ff0057;
       font-family:Arial;
       font-size:10pt;       
       background-color:#000000;
       border-width:1;
       border-style:solid;
       border-color:#242424;
       margin-top:7px;">
</form>
</center>
</div>

<p><center>
<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

Did you use this script? Do you like this site? Please link to us!

Leave a Response

(0 comments)

Alphabetical Listing

Tutorials

Ajax Tutorials

Ajax

Buttons

Cookies

CSS

Forms

Games

Generators

Image Effects

Math Related

Miscellaneous

Multimedia

Navigation

Page Details

Password

Snippets

Text Effects

Time & Date

User Details

Floating Email-This-Link

Leave a Response

Attention JavaScript Coders

Go Deeper