43 comments found.
I’ve noticed that when you have more than three or so ‘before and afters’ on a single page, things start bog down and run really slowly.
Do you know of any way I could avoid the slow down? I’m open to whatever ideas you might have.
Thanks
You could disable the intro animation for all except first one. And use smaller images, maybe with a max width of 600px.
Thanks for the suggestions
Confused, just doesn’t display correctly on my clients site with your test images. Could you please tell me what the heck is throwing the div off?
HI,
What do you mean by “way off”? How is it supposed to look?
Fixed the placement problem. It isn’t working under IE8 for me. All pictures are above one another with no before after effects at all. Let me know if you want a snapshot.
Hi,
Give me a private message for the IE8 issue.
So could I put my images in a fluid width container? Or do they need to have set widths at different breakpoints?
Anyway you wish. By default the viewer has auto width, taking the width of the container. You can then set css rules for it if you thing you need more advanced sizes depending on screen size. Or you can set a fixed size that will always be used.
Awesome thanks! I’ve downloaded it now so I’ll let you know if I have any troubles. Cheers!
Viewer UPDATE – Version 1.5 – 26-dec-2012
– tweaks for touch interface: draggable slider on touch
– removed the jQuery-Draggable plugin and replaced with a custom script to prevent compatibility issues
– updated included version of jQuery to version 1.8
Great work but not responsive! I’ve try everything to make it work on iPad but it didn’t work.
Sorted.
Nice, do you have any plans to make it compatible with touch devices.
It is compatible with touch devices.
Hi, I´m trying to make it work wi the ipad 3 and I can´t get the before-after bar to work, just the buttons to change slides are working.
Could you explain a little bit how the responsive version works? (or do you have a demo somewhere). Just want to make sure it’s going to work for my project before purchasing. Thanks!
Hi, the responsive feature lets you set the size of the viewer more freely. The default behavior makes the viewer occupy the entire container width. To customize the width you can set the width in three ways : setting directly the width setting to a number or a percent …. or by using media queries and set his size depending the width of the screen. The height by default takes the size of the image height… but can be forced to have a fixed value.
FILE UPDATE – 9 August 2012
- responsive structure
- new initialization method(auto-starts using a special class = wpw-auto-init-ba)
- tag attributes setting method(this will be the default setup from now)
- js file name without versioning(that will be inside only)
- title visible for single items also
Your Live Preview website gives me a warning of possible malicious content, since it connects to fiber*stat.com…
How’s that?
Hi,
Sorry about that. My hosting managed to get some files corrupted by some malicious code. Now is ok.
That was only a preview problem, hosted by me.
Thanks for the notice. Cheers
Before purchasing this I’d like to know.. would it be possible to have the image-container scale-able (scaling the pics in the container as well of course)? So I would not be restricted to showing just a tiny pic to accommodate the smallest screen.
Cheers Kolby
Fooking Awesome! Well worth the $7. There is a free one out there, but it is not nearly as versatile, and is not set up to use more than 2 images.
Thank you for this.
As a suggestion (for future upgrades) is there a way to customize the themes to look something like this http://ortho.drsesame.com/before-and-after – (scroll to the bottom of the page) It looks like they started with a jquery plugin, and adapted it.
10 June 2010 – Viewer Updated.
All they buyers are required to download again the viewer files.
Details about the update in the Item Details tab.
Cheers.
Hi WikedPixel,
Very nice interface. I like it.
If there are 5 photos in the gallery then by default the 1st photo will appear on the gallery viewer, isn’t it?
Is there any possibility that by default it would show the 3rd photo instead of the 1st photo?
Basically, I wanted to choose which photo I want to show off rather than the 1st photo.
Thanks in advance.
Regards, Garzideas
Hi, send me a private message and i will send you a tweaked version that has that option. 
Really nice effect! Great plugin 
Really cool:) If the slider handle would be slightly bigger. I’ve sooo much trouble “picking” it on my 22” screen.
That button size if 36px*16px. If you have trouble in clicking that area then you have trouble in clicking a lot of things. Like closing windows/mac windows, using video player buttons or even one-word text links. And that is not my problem. 
Hello,
yes but, the answer is not what i have expected. I could be a disabled person, you should pay attention to such things or better say, think twice before you speak about this once.
Really sorry to hear this.
Hi,
That handle is bigger than what you see on the screen. There are some several transparent pixels over and under it. It’a a png image.
1. Making it graphically bigger will mean more content covered/hidden.
2. If the user clicks near the handle, the handle will go at his position.
3. If buyers really need that handle bigger, I can show them what css property to edit.
Cheers.
Really awesome work! I bet you’ll make huge amount of sales
wow, just wow
i’m gonna definitely use this in my next projects…
Not sure if the Australian ABC are using your script or not, but looks very similar. http://www.abc.net.au/news/infographics/qld-floods/beforeafter.htm – either way, awesome stuff. I’ll probably purchase this soon.
I hate being a parrot, but
“awesome man”
- Fifty
edit: it’s lovely how you can sign in into your other accounts without even knowing.
