ShadedBorder | JavaScriptSource

ShadedBorder

Steffen Rusitschka Sep 5, 2007

General

This script creates rounded corners with a drop shadow without using images. You can use different formats on the same page. Highly customizable. Non-obtrusive.


Ma quande lingues coalesce, lingue es plu simplic regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues.

Ma quande lingues coalesce, lingue es plu simplic regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues.

Note: This is plain, without the script. Lorem ipsum dolor sit amet, consecte adipiscing elit.

Notes

It is important that it uses the CSS class "sb" and that it does not directly contain text nodes, i.e. text must always be wrapped inside an HTML element.

Since the script adds DIV elements to the element you round, those elements cannot be UL, OL, TABLE, TR, etc.. Allowed are DIV, LI, TD, TH, i.e. those elements that are allowed to directly contain DIV elements.

Further details can be found on the author's Web site.

Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: shadedBorder.js


CSS

Paste this code into your external CSS file or in the <style> section within the HEAD section of your HTML document.


Head

Paste this code into the HEAD section of your HTML document.


Body

Paste this code into the BODY section of your HTML document


Leave a Response

(10 comments)

Due to the limitations of these comments, you will need to submit your question to the [a href="http://www.webdeveloper.com/forum/forumdisplay.php?f=3"]JavaScript Forum[/a] for further help.

Lee Underwood Jan 29, 2008

If I try to put in an image within the body of the text using an image tag, it doesn't show.[br /][br /]Additionally, when I view the page the first time, utlizing the code, the bottom border is dysfunctional. If I move to another tab for a moment or switch windows for a short time, the issue resolves itself (border only, but not image issue.)[br /][br /]I do like the effects, but in its present state, I don't believe it will work for me.[br /][br /]If I am overlooking something obvious, please let me know.

Victor Velle Jan 19, 2008

It's right in the script. You need to change the class.

Lee Nov 6, 2007

You will need to submit your question to the [a href="http://www.webdeveloper.com/forum/forumdisplay.php?f=3"]JavaScript Forum[/a] for further help.

Lee Nov 6, 2007

Great! You might just fire off an e-mail to the author also.

Lee Oct 3, 2007