Looking for jQuery plugin - flyout block

Question

I'm looking for a jQuery plugin, which could create a flyout of a container from left or right side of a page on some event (onClick or onMouseOver).

The example can be found at http://www.nationalgeographic.com/ - when the page loads some shopping ads slide from the left side of the browser screen (it's shown automatically only once, to see it again you need to delete this website cookies and reload the page - it would be great if the plugin had this cookie-based feature).

Yeah, writing my own solution turned out to be the only way. I've made the container to slide out when visitor reach the bottom of a blog post and i made it cookie-based, so once it is closed it won't bother visitor for a certain period of time, here's my solution, scroll to the bottom. — Nikolay, Nov 21 '11 at 14:21
Here's my solution: http://www.artmetod.ru/context-advertising/308 (scroll to the bottom). Since no one adviced a proper plugin the bounty goes to the person who recommended self implementation. — Nikolay, Nov 21 '11 at 14:22

score 4 · Accepted Answer · answered Nov 18 '11 at 23:51

4

What you're trying to achieve is actually quite easy to implement yourself. Here's the quick example: http://jsfiddle.net/JYRhh/ Click on gray block to expand it.

answered Nov 18 '11 at 23:51

NewlessClubie

983
2
8
18

Nice - easier than other ways I have seen this done! – FeralReason Oct 22 '16 at 17:27

Joe C. · Answer 2 · 2016-10-06T18:06:36.790

0

It doesn't have cookie functionality, but the Flyout Ribbon plugin seems to be what you're looking for. You'll likely need to modify the CSS slightly so that it doesn't take up the entire page.

Edit: Apparently the original link died a horrible death over the past few years. Here's a Wayback Machine link to the original page.

edited Oct 06 '16 at 18:06

answered Nov 16 '11 at 18:59

Joe C.

1,538
11
14

That's far from what i'm looking for, guess i'll just have to write it down myself from the scratch. Thanks anyway. – Nikolay Nov 17 '11 at 08:32
don't click on the link, the website seems to be flagged or something – Phil Oct 05 '16 at 00:40
@Phil: The original site died. I've added a Wayback Machine archive link for posterity. – Joe C. Oct 06 '16 at 18:07

score 0 · Answer 3 · answered Nov 17 '11 at 10:00

Here are some of the jquery plugins which may be useful for you

http://www.building58.com/examples/tabSlideOut.html (looks exactly like the one in NGC website)

http://dumitruglavan.com/jQuery-Feedback-Badge/

The below one may be the most suitable for you

http://www.freecss.info/tutorial/contact/index.html

check out its demo here

hope one of the above jquery plugins will be helpful

score 0 · Answer 4 · edited Nov 17 '11 at 21:46

There is a plugin called jquery dock that may accomplish the functionality you are looking for. It looks like it can dock to the top, bottom, left, or right, and may even be able to dock to specific elements. On hover the dock is fully opened into view, otherwise it is partly hidden. Looks like you can bind it to other events other than hover if required.

Here a link to the demo and download, and here is a link to the demo.

Looking for jQuery plugin - flyout block

4 Answers4