![]() |
|
|||||||
| Notices |
| Graphic Design & Web Design Critique Get Critique from other designers on your graphic & web designs |
![]() |
|
|
LinkBack | Thread Tools | Display Modes |
|
|
|
|||
|
I really appreciate your help. This is actually the first forum that I register in. How can you design a layout or template using illustrator? Is it possible.
I will try to redesign the whole site using CSS/HTML. Thanks |
|
|||
|
I was just playing with CSS just now, and I came up with this design, it's not done yet though. Website
Thanks for your help. Please critique! |
|
|||
|
Your website looks really good. What did you use to make the arrow move?
|
|
||||
|
Quote:
HTML Code:
<!-- Nav Arrow --> <script type="text/javascript"> var navArrowSlider = function(navWrap, navElementsArray, activeID, arrowY) { var youAreHere = new Fx.Tween($(navWrap), { duration: 1200, transition: Fx.Transitions.Elastic.easeOut }); $$(navElementsArray).each(function(item){ item.addEvent('mouseenter', function() { var thisPos = item.getPosition(navWrap).x + item.getSize().x - 50; youAreHere.cancel(); youAreHere.start('background-position', thisPos + 'px ' + arrowY + 'px'); }); }); var currentArrow = function() { youAreHere.cancel(); var activePos = $(activeID).getPosition(navWrap).x + $(activeID).getSize().x - 50; youAreHere.start('background-position', activePos + 'px ' + arrowY + 'px'); }; //correct IE rendering problem (without this, it wont go to the active nav onload) var activePos = $(activeID).getPosition(navWrap).x + $(activeID).getSize().x - 50; $(navWrap).setStyle('background-position', activePos + 'px ' + arrowY + 'px'); //works to set image to starting position in other browsers currentArrow(); $(navWrap).addEvent('mouseleave', currentArrow); }; window.addEvent('domready', function() { navArrowSlider( 'nav_wrap', // ID of nav wrap '#nav ul li', // Array selector of nav elements 'active_nav', // ID of current nav element '50px' // Background position y of background image ); }); </script> <!--/Nav Arrow -->
__________________
Tommy Logic ™ Web Design :: Valid XHTML & CSS :: SEO :: CMS :: eCommerce Web Design Tutorials :: Computer Tutorials |
|
||||
|
:D
Thanks Tommy, Its mootools 1.2, IMHO the best javascript library around. You can find the full documentation for it here: Simple Animated Menu for Mootools 1.2 -- consider: open blog | Web Design, Development and Marketing If you are interested in playing with it, you can get the zip with a css file, a basic html template, the mootools js and the menu js here: http://www.consideropen.com/download...mated_menu.zip The menu code is dedicated to the public domain, so you can do whatever you want with it. |
|
||||
|
yeah.. I figured it was a MooTools library. Fairly typical animation for them. I prefer moo over jQuery any day
__________________
Tommy Logic ™ Web Design :: Valid XHTML & CSS :: SEO :: CMS :: eCommerce Web Design Tutorials :: Computer Tutorials |
![]() |
|
|
| Thread Tools | |
| Display Modes | |
|
|
Similar Threads
|
||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| Portfolio site critique | likethegoddess | Graphic Design & Web Design Critique | 12 | 29-05-2008 10:51 PM |
| Design Portfolio/Personal | dustyfantildeath | Graphic Design & Web Design Critique | 4 | 26-03-2008 04:46 AM |
| Portfolio Site Critique - In Progress | designfire | Graphic Design & Web Design Critique | 7 | 17-09-2007 10:53 PM |
| Personal Portfolio Redesign - Critiques Wanted | bluesage | Web Design Forum Showcase | 7 | 13-07-2007 02:32 PM |
| Personal Portfolio. | hideout | Web Design Forum Showcase | 8 | 12-04-2007 08:13 PM |
| All times are GMT. The time now is 03:31 AM. |