frame slider problem

by techunter

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css">
<iframe id="main" src="http://fiddle.jshell.net/techunter/rQr5Q/29/" width="100%" height="500"></iframe>

CSS

.behind,.front{
    width:200px;
    height:100px;
}

JavaScript

/*!
 * jQuery UI 1.8.21
 *
 * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI
 */
(function( $, undefined ) {

// prevent duplicate loading
// this is only a problem because we proxy existing functions
// and we don't want to double proxy them
$.ui = $.ui || {};
if ( $.ui.version ) {
    return;
}

$.extend( $.ui, {
    version: "1.8.21",

    keyCode: {
        ALT: 18,
        BACKSPACE: 8,
        CAPS_LOCK: 20,
        COMMA: 188,
        COMMAND: 91,
        COMMAND_LEFT: 91, // COMMAND
        COMMAND_RIGHT: 93,
        CONTROL: 17,
        DELETE: 46,
        DOWN: 40,
        END: 35,
        ENTER: 13,
        ESCAPE: 27,
        HOME: 36,
        INSERT: 45,
        LEFT: 37,
        MENU: 93, // COMMAND_RIGHT
        NUMPAD_ADD: 107,
        NUMPAD_DECIMAL: 110,
        NUMPAD_DIVIDE: 111,
        NUMPAD_ENTER: 108,
        NUMPAD_MULTIPLY: 106,
        NUMPAD_SUBTRACT: 109,
        PAGE_DOWN: 34,
        PAGE_UP: 33,
        PERIOD: 190,
        RIGHT: 39,
        SHIFT: 16,
        SPACE: 32,
        TAB: 9,
        UP: 38,
        WINDOWS: 91 // COMMAND
    }
});

// plugins
$.fn.extend({
    propAttr: $.fn.prop || $.fn.attr,

    _focus: $.fn.focus,
    focus: function( delay, fn ) {
        return typeof delay === "number" ?
            this.each(function() {
                var elem = this;
                setTimeout(function() {
                    $( elem ).focus();
                    if ( fn ) {
                        fn.call( elem );
                    }
                }, delay );
            }) :
            this._focus.apply( this, arguments );
    },

    scrollParent: function() {
        var scrollParent;
        if (($.browser.msie && (/(static|relative)/).test(this.css('position'))) || (/absolute/).test(this.css('position'))) {
            scrollParent = this.parents().filter(function() {
               ...