Jump to content
Sign in to follow this  

Site Logo/ Image Watermark Script

Recommended Posts

This is a site logo/watermark script that lets you display a static image at any of the four corners of the browser, never going out of sight. It's useful for branding purposes, or to offer visitors an easy way to jump back to your site's homepage. The logo can be set to disappear after x seconds (as you specify in the code).



Simply add the below code inside the <HEAD> section of the page you wish the logo/watermark to be shown:



<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>


<script type="text/javascript" src="staticlogo.js">





//download the file staticlogo.js






The above code references the external .js file "

staticlogo.js", which you need to download (right click, and select "Save As").


Important Note: Your page should contain a valid doctype at the very top for this script to work properly. If your page doesn't, the logo will be made stationary on the page via scripting instead of CSS, which is less smooth.




Inside the .js file, you should configure the following variables:

setting: {orientation:4, visibleduration:20000, fadeduration:[1000, 500]}, //orientation=1|2|3|4, duration=millisec, fadedurations=millisecs

offsets: {x:10, y:10},//offset of logo relative to window corner

logoHTML: '<a href="http://www.dynamicdrive.com" title="Dynamic Drive"><img src="logo.gif" style="width:50px; height:47px; border:0" /></a>', //HTML for logo, which is auto wrapped in DIV w/ ID="mysitelogo"

Most of them are fairly self explanatory. For setting.orientation, it sets the orientation of the logo relative to the window edge, and should an integer from 1 to 4 (1=top left corner, 2=top right corner, 3=bottom left corner, 4=bottom right corner). The option setting.visibleduration sets the duration (in milliseconds) before the logo disappears. For perpetual, enter 0 instead.

Share this post

Link to post
Share on other sites

Superb coding dude.It will work for me really good.thanks

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this