NotOneBit Blog

Get started today on your next web project with NotOneBit
We've been doing web development before you were born *

519 thoughts on “jQuery Before/After Plugin

  1. Hi. I included this plugin into a joomla 3 page as described above. In Firefox i can see and use it. But in google chrome, nothing is displayed :(
    I could edit the css, if there was any. Could you please rewrite this plugin to use an extra CSS file and use some classes, so ciritical styling-bugs can be corrected more easy?

    Here’s the page, where it does not work:

  2. I’m having difficulties putting a group of these side by side horizontally. Is this possible? What would the div structure look like?

  3. What i do not understood is if truth be told how you’re no longer actually much more
    neatly-preferred than you may be now. You’re very intelligent.

    You know therefore considerably relating to this topic, made me
    personally imagine it from so many varied angles.
    Its like men and women are not interested until it’s
    something to accomplish with Girl gaga! Your personal stuffs excellent.

    All the time take care of it up!

  4. Nice work. A friend found your widget used on the UVa (University of Virginia) site and asked me if I could implement it for him. Helpful docs and I was up and running in about 10 minutes. Quite cool.

    I am just starting to setup a proper site for him, but here is a quick mockup of the before/after tool in use: (should be interegrated into WordPress and on a different url soon…)


  5. Hi,
    We’ve been using this code on our home page, and it works great, but there’s one issue: on mobile devices, the two images appear on the page with the second one vertically below the first for a moment – sometimes many moments, as in half a second or more. Any advice about how to make it behave better on mobile devices?


    1. You could hide your images with CSS (display:none) then using jQuery and the window load event, show the images. That would prevent the flash of unstyled content.

      1. Thank you! Excellent idea. It worked to an extent. Now instead of seeing the two images momentarily, one sees an empty box momentarily. But I think that’s easier to live with than the double image.

  6. I noticed i had to rename the handle images handle.gifrt-small.png ect. and handle.gifhandle.gif

    in the package that you can download the names are different, but the links of the imgs point to the file names mentioned above.

  7. It’s also appropriate for the united states Food and Drug Administration (FDA)
    to find yourself in business of managing e-cigarettes to ensure
    they don’t have a lot of poisonous and unnecessary chemical compounds in them and also
    to establish accountable processes and criteria when it comes to
    production and advertising of this products.
    As far as the average e-cig individual is concerned, e
    cigarettes are really just consists of 3 main components.
    Vaping beginner kits begin at about $30.

  8. Pictures are not scaling properly and green handle is not showing up…any suggestions? are my pics to big? they are both 1024px X 633px

  9. Great Plugin! Good job!

    Regarding image sizes. Would it still run when I put it on twitter bootstrap ? Thanks in advance


Leave a Reply

Your email address will not be published. Required fields are marked *

%d bloggers like this: