Owner: Leigeber URL:http://www.leigeber.com/ Join Date: Sun, 20 Apr 2008 20:36:49 -0500 Rating:0 Site Description: Leigeber.com features articles on XHTML, CSS, Ajax, Photoshop, PHP, and more. Site statistics:Click here
5 JavaScript Best Practices 0000-00-00 00:00:00 JavaScript is an extremely powerful and flexible scripting language. Unfortunately flexible, for many people, means fallible. I am going to highlight 5 best practices that you can use in any JavaScript project. These are very broad, I will follow up soon with more specific best practices.
First and foremost, keep your ... Read more:JavaScript
Custom Digg Counter in WordPress with PHP 0000-00-00 00:00:00 You will notice in the lower right corner of this entry that there is a reference to the number of Digg
s for this post. If you click the counter you are taken to Digg. Digg does offer a few easily integrable scripts at but does not document how to ... Read more:Counter
Lightweight Accordion with JavaScript and CSSl 0000-00-00 00:00:00 The JavaScript
for the simple accordion above is 1.65 kilobytes when packed. If you have a small project that could use an accordion and don't want to include an entire JavaScript framework to do the job then give this script a try.
You will need to call the following function in ...
CSS Shorthand Cheat Sheet 0000-00-00 00:00:00 Based on the feedback from my article last Friday I thought it would be useful to create a CSS cheat-sheet. For those of you that are not familiar with shorthand you can print this out and keep it handy. Try and use these principles whenever you code and before too ... Read more:Cheat
Custom JavaScript Dialog Boxes 0000-00-00 00:00:00 I have put together a lightweight (~4.5kb) JavaScript
dialog box library. The script currently offers four dialog styles: alerts, warnings, prompts and success. There is nothing to add to your page except references to the JavaScript and CSS if you choose not to incorporate them in your existing files. The ... Read more:Dialog
, Boxes
Introduction to Web Caching 0000-00-00 00:00:00 To begin I would like to thank all of you that have shown interest in this blog and posted comments. The site launched one week ago and has already generated over 13,000 unique visitors and 40,000 page views. As I am writing this article my previous post is on the ... Read more:Introduction
Dynamic Inline JavaScript Form Validation 0000-00-00 00:00:00 This lightweight form alert script allows you to easily add attractive validation messages to your forms. There is no markup to add on your existing page. Just call the inlineMsg() function when you wish to display a message. The position of the form element (or any other element) is dynamically calculated.
Call the function as follows...
inlineMsg('name','You must enter your name.',2);
The first parameter is the id of the element you wish to display the warning in relation to. The second is the string you wish to display in the message box. You can include HTML, just be sure and escape when necessary. The third parameter is the time to display the message in seconds. It is optional and if left empty will default to the MSGHIDE variable in the JavaScript
which is initially set to 3.
Th Read more:Dynamic
, Inline
, Validation
Sliding JavaScript Dropdown Menu 0000-00-00 00:00:00 This lightweight drop down menu script (~1.8kb) allows you to easily add smooth transitioning dropdowns to your website. This can be used for navigation, dropdown lists, info panels, etc. The script has been tested working in IE6, IE7, IE8, Firefox, Opera and Safari. The markup for the menu including the mouse events looks like the following.
Dropdown One
Navigation Item 1
Navigation Item 2
Navigation Item 3
Navigation Item 4
Navigation Item 5
You can have as many dropdowns on one page as you like. Just be sure and have a unique naming scheme for each menu (i.e. one-ddheader, two-ddheader, etc). The "look and feel" is fully customizable though the CSS and you can replace the unordered list with any content you like if you are not looking for Read more:JavaScript
, Sliding
JavaScript Color Fading Script 0000-00-00 00:00:00 This lightweight JavaScript
allows for easy color transitions. Add fading effects to tables, divs and more. You can target an elements background, border or text color.
Below is the command to call the function...
colorFade('divid','background','ece7b4','f9bcbc',25,30)
The first parameter is the id of the element you are targeting. The second is the property to fade which can be the background, border or text. The third is the hex value of the starting color. The third is the hex value to fade to. The fourth and fifth are both optional. The first is the the number of times to divide the color difference and the last is the transition speed.
This script has been tested working in IE6/IE7, Firefox, Opera and Safari. Please report all bugs to michael@leigeber.com.
Click here to view the Read more:Color
, Fading
Ultimate JavaScript Scroller and Slider 0000-00-00 00:00:00 This versatile and lightweight JavaScript
clocks in at less than 3.5kb unpacked. The above example is one of four scenarios I have demonstrated on the demo page.
To setup a scroll/slide area create a container with the following CSS properties...
position:relative; overflow:hidden; height:XXXpx;
Inside the scroll area container create another div that will house your actual content. It needs the positioned absolutely within the previous div. Each sliding or scrolling area on the page needs to have a unique ID for this div.
position:absolute;
Inside the content div you can need to create a section for each area of content, be it 1 or 50. For each section after the "prefix-" numerate the order from 1 onwards. The prefix (ie section, newssection, imgsection, etc) needs to be unique to th Read more:Ultimate
, Slider
Looking for Feedback and Suggestions 0000-00-00 00:00:00 Leigeber.com has been live for only two and a half weeks but there has been a tremendous response with almost 45,000 visits. I would like to get feedback from you on the site so far, where you would like to see it go and what articles/scripts you would like to see posted. The current layout was put together quickly to get the site up and I have begun work on a much better and permanent design. I have been documenting the new design process and Wordpress integration and will be posting a few articles when it launches. If you have any suggestions or requests before the new site goes live I would appreciate it. There will be a number of new features and enhancements in the upcoming version. Feel free to email me at michael@leigeber.com or post a response here. Read more:Feedback
Free Simple Wordpress Theme 0000-00-00 00:00:00 I have stripped down the previous WordPress theme for Leigeber.com and uploaded it for download if anyone is interested. It is very simple, clean and coded with valid XHTML and CSS. Hopefully this can be a good starting point for anyone looking to create their own template. This is tested working in IE6/IE7, Firefox, Opera and Safari. If you have any problems or questions shoot me an email at mich Read more:Simple
, Wordpress
, Theme
Dynamic Image Gallery and Slideshow 0000-00-00 00:00:00 This extremely lightweight JavaScript image gallery and slideshow script clocks in under 3kb packed and includes a number of cool features. Recently I was looking for a nice existing script for a client project. I wanted something elegant, simple and lightweight. What I found were a number of scripts built on JavaScript frameworks and a few others that really lacked any appealing interface or were Read more:Dynamic
, Image
, Gallery
, Slideshow
Vertical Flyout JavaScript Menu 0000-00-00 00:00:00 This animated JavaScript
flyout menu is clean and lightweight at only 1.6kb. The script is based on the post a few weeks ago of a horizontal dropdown menu. The markup is the same so visit the horizontal menu post for details.
This script has been tested in IE6/IE7, FF, Opera and Safari. Feel free to use it in any personal or commercial projects. Send any bug reports to michael@leigeber.com.
Clic Read more:Vertical
Horizontal JavaScript Accordion 1kb 0000-00-00 00:00:00 This versatile 1kb horizontal accordion script can be used for menus, images, presentation content and more. I had seen a similar looking feature on the mootools homepage and set out the replicate the functionality as a standalone script and as lightweight as possible. The script will automatically adjust to the number of elements in the accordion and the dimensions of the accordion.
The front-e Read more:Horizontal
, JavaScript
Sliding JavaScript Menu Highlight 1kb 0000-00-00 00:00:00 This sliding hover effect script is an easy method to add some flavor to your navigation. Using the CSS you can easily customize the navigation to fit your "look and feel". The markup for the script is very simple as below...
JavaScript
Graphic Design
HTML
User Interface
CSS
In the above code the default menu selection is identified by the Read more:Sliding
, Highlight
Fading JavaScript Tooltips 2kb 0000-00-00 00:00:00 This animated JavaScript
tooltip script is very easy to use and lightweight at only 2kb. It is tested working in IE6+, Firefox, Opera and Safari. Jacob Gube of Six Revisions has posted the script and a walk-through of the code and the logic. As always, don't hesitate to send questions or bug reports to michael@leigeber.com. I look forward to upcoming guest posts by Jacob on this blog as well.
Cli Read more:Fading
Recommend Site To A Friend
