Simple Animated Menu with Mootools

Curious how to build something like the menu featured on this site for your next web design project? (note IE6 users – the menu is not implemented for you as your browser does not properly support png transparency, but with a solid background, it would work great). To make the menu, you won’t even have to muck about in javascript.

Simply define:

  • a container for the background image
  • the nav elements
  • the ‘current’ nav element ID
  • the animation’s horizontal track (the y coordinate of the background-image)
  • the left offset of the image in relation to the nav element

Basically, you just tell the function where to put the background image you want to animate, what the buttons are and how to identify the current id, then position its x and y coordinates in relation to the elements. If you are new to javascript web development, and not sure what this all means, keep reading. It breaks down very simply.

mootools_menu

Requirements: MooTools 1.2
License: Public Domain Certification
Demo: http://www.consideropen.com/blog/2008/06/simple-mootools-12-animated-menu/


No Comments »
glossy.js – Javascript image effect

Glossy.js allows you to add corners and shading and shadow to images on your webpages.

Forget image software to create effects on your images. Your image will stay as original and your can change the effect when ever you want without open any image editor. It’s time that you reduce on your development and it work’s just great.

Gloosy.js works in all major browsers. If not supported by a browser, it downgrades itself without creating any errors.

glossy

Requirements: None
Website: http://www.netzgesta.de/glossy/
Demo: http://www.netzgesta.de/glossy/
Download: http://www.netzgesta.de/glossy/


No Comments »
FameID Flash XML Menu

FameID Menu is an easily configurable and XML driven menu that allows to add navigation menus to your website in no time. It does not require any programming skills nor takes long to install and configure. It is straight-forward and can be transformed from one look to another in minutes.
You can set up different configuration sets (looks) for your menu and load up any of them at any time.
It is very flexible in the way that it can be configured so that you can change almost anything in its look. Things like items’ background images, transparency levels, colours, sizes, speed of animation, general looks of items, their borders or their submenus can be changed by just editing a common confuration file, which is written in plain text.

fameIDmenu

Website: http://www.fameid.com/menu/index.php
Demo: http://www.fameid.com/menu/index.php?option=com_content&task=view&id=14&Itemid=15
Download: http://www.fameid.com/menu/index.php?option=com_content&task=view&id=15&Itemid=19


No Comments »
AnythingSlider – A jQuery Slider Plugin

AnythingSlider is a jQuery slider plugin which can present any HTML content.

It can display unlimited numbers of slides  and the navigation tabs are built and added dynamically, it has auto-playing (optional feature, can start playing or stopped) and each slide has a hashtag (can link directly to specific slides).

Also have infinite/continuous sliding (always slides in the direction you are going, even at “last” slide) and it allows multiple sliders  per-page (hashtags only work on first)

anythingslider

Requirements: jQuery
Website: http://css-tricks.com/anythingslider-jquery-plugin/
Demo: http://css-tricks.com/examples/AnythingSlider/
Download: http://css-tricks.com/examples/AnythingSlider.zip


No Comments »
360 WebCMS ASP.NET

360 WebCMS is an advanced ASP.NET-based content management system which gives you total control over your website. You can use our content management tools to manage all aspects of your website, build custom forms with our form builder, customize the look and feel of your site with our template manager and add advanced functionality to your website using our custom modules.

360cms

Features:

  • Advanced Content Management Tools
  • Form Builder
  • Templating
  • Custom Modules
  • Secure
  • Search Engine Friendly
  • Multi-Site CMS

Requirements: —
Website: http://www.360webcms.com
Download: —


No Comments »
Your ads
flabell
advertise
Advertisement