[jQuery] Hover Zoom Effect: Horizontal [RSTForums.com]

<!--
    Everything in here is required for the effect to work.
    This is the source code for the horizontal effect.

    author Gecko @RSTForums.com
-->

<!-- Stylesheet -->
<style>
.container {
    overflow: hidden;
    width: 400px; /* Container width */
}
.container img {
    position: relative;
}
</style>

<!-- Markup -->
<div class="container">
    <img src="http://www.g3x0.com/rst/images/mago-huge.jpg" />
</div>

<!-- jQuery -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<!-- Hover Zoom Effect -->
<script>
$(function() {
    var container = $(".container");

    container.mousemove(function(e) {
        var parentOffset = $(this).offset();
        var x = e.pageX - parentOffset.left;
        var image = $(this).find('img');

        if (image.width() > $(this).width())
            image.css({ left: - x / $(this).width() * image.width() + x + 'px' });
    });

});
</script>