Quantcast

Shadowbox v3.0.3 with WOWslider DEMO

classic Classic list List threaded Threaded
4 messages Options
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Shadowbox v3.0.3 with WOWslider DEMO

arttronics
This post was updated on .
This DEMO shows how to use the Shadowbox rel Attribute with the jQuery WOWslider plugin.

The version of Shadowbox required is with the jQuery Adapter, so make sure to Download Shadowbox with that option if you don't already have it.

The markup presented will show you how to add a simple modification to the WOWslider script to accommodate Shadowbox.

Global settings in Shadowbox.init along with all Shadowbox rel Attributes and the anchors title attribute are available to use. The use of the Shadowbox Gallery is another option to consider as well.

The end result is a slideshow presentation of images that is the catalyst to launching Shadowbox with a larger image or even different media entirely. Tested in all browsers with no issues.

Right mouse-click this HTML file and save to your hard drive.
Shadowbox_with_WOWslider_DEMO.html

EDIT: Download link provided.

When posting your markup here on the forum follow these simple steps:

0. Login and paste your markup into the Message Box.
1. Mouse select the markup you just pasted.
2. Press the More Button from the Message Box Toolbar.
3. Select Raw text from the drop down menu. DONE!

If I don't respond to your POST, it's your inability to provide your markup correctly.

Check out a few DEMOS I made that are here in this forum.

Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Shadowbox v3.0.3 with WOWslider DEMO

fifiann
The demo worked great work with both image and video but it was only able to show the first image/video only since I wasn't able to make all the changes required.

I couldn't locate the I.setAttribute, there's only f.setAttribute("href", c.href); in the wowslider.js, therefore couldn't make the changes below.

Search for reference location
I.setAttribute("href", d.href);


Then add the following new 2 attributes AFTER the semicolon seen above:
I.setAttribute("title", d.title);I.setAttribute("rel", d.rel);

please help.  Thank you so much!
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Shadowbox v3.0.3 with WOWslider DEMO

Clos
In reply to this post by arttronics
Appears to work fine in IE but fails to launch correctly in Chrome.  Instead rel link opens in new window.  Possible config issue but have checked implementation twice.  Partially works if I comment out the $("#wowslider-container1".wowSlider initiator line but then I lose the navigation
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Shadowbox v3.0.3 with WOWslider DEMO

Daniele
In reply to this post by arttronics
hello, I can not make it all work. would you give me a help?
Loading...