Forums
Overview »
Coffee & Tea TalkZone » dmx zone designs fly out
dmx zone designs fly out |
phil vouers Member
 Since: 23 Oct 2008 Posts: 67 | Posted 24 Sep 2011 16:34:56 How do you do that neat flyout that you have added to your site. How do you do that neat flyout that you have added to your site. |
| |
Patrick Woldberg Official Representative
 Since: 11 Feb 2003 Posts: 1,927 | Replied 26 Sep 2011 13:33:20 It is a div positioned with css and animated with jquery. some css like: div.flyout {
position: fixed;
background: #f00; /* place some image or so */
width: 500px;
height: 500px;
right: -480px; /* place outside screen, only 20px visible */
top: 50%;
margin-top: -250px;
}then some javascript: $('div.flyout').hover(function(e){
$(this).animate('right', 0);
}, function(e){
$(this).animate('right', -480);
});That would be the basics, you should have of course a div with a class flyout on the page, you can add more to the flyout like a banner or so, also you can play with the css and animation. |
| |