Jquery déplaçable à l'extérieur de l'overflow hidden?

Voici ce que j'ai pour l'instant, regardez sur stackoverflow partout et de toutes les solution n'a pas fonctionné pour moi 🙁 Le problème est que j'utilise déplaçable et redimensionnable sur certains éléments, etc. des images qui sont des lieux dans un conteneur qui a propriété overflow.Que vient le problème avec déplaçable, je veux ot déplacer l'objet sur l'image en haut de la page, mais l'élément va toujours sous l'image sur le dessus.Strane question est si je le premier à redimensionnable, que je possible de déplacer l'élément sur l'image, avant qu'aucun changement 🙁 un Autre strane problème est que j'ai d'abord à redimensionnable, le deuxième objet est sur cet élément, juste la superposition?

J'ai essayé beaucoup de solution pour ces deux corrections, mais pas de chance. Voici ce que j'ai pour l'instant

CSS

#zidomotac{
    width:100%;

}
#myWorkContent{
width:100%;

    overflow-x: scroll;

    white-space: nowrap;
    box-sizing:border-box;
    margin-bottom:20px
    }
.slikezamenjanje{
    width: 100px;
    float:left;
    display: inline-block;
    vertical-align: middle;
}
.slikezamenjanje img{
    max-height: 120px;
    overflow:hidden;
    width: 100%;
}

EXTERNE

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
 <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

FONCTIONS

<script type="text/javascript">
        $(document).ready(function() {
            $('.slikezamenjanje').draggable().resizable({
      aspectRatio: 16 / 9,
    });
        });
    </script>

HTML

<div id="zidomotac"><img src="http://www.vectorimages.org/09/0920100513111825424.jpg"></div>

<div id="myWorkContent">

  <div class="slikezamenjanje"><img src="http://placekitten.com/200/200/"/></div>
<div class="slikezamenjanje"><img src="http://placekitten.com/200/200/"/></div>

</div>

</div>

C'est le travail jsfiddle
http://jsfiddle.net/gorostas/CS93M/
J'espère que quelqu'un va trouver une solution

ÉDITÉ

Peut-être que je peux faire d'abord invoquer redimensionnable et puis à l'intérieur de déplaçable?

Mise à JOUR

Si j'utilise déplaçable comme ce

        $(document).ready(function() {
$(".slikezamenjanje").draggable({
            revert: "invalid" ,
            helper: function(){
                $copy = $(this).clone();
                return $copy;},
            appendTo: 'body',
            scroll: false
        });
        });

Je peux me déplacer élément, mais le problème c'est de retour?

OriginalL'auteur Miomir Dancevic | 2013-10-10

  1. 12

    Je fixe le violon, je souhaite, c'est ce que tu voulais !
    Vous pouvez essayer ici :
    DÉMO

    Ce que j'ai changé :

    JQuery :

    $(function() {
    $( ".slikezamenjanje" ).draggable({
        revert: 'invalid',
        helper: 'clone',
        start: function(){ //hide original when showing clone
            $(this).hide();             
        },
        stop: function(){ //show original when hiding clone
            $(this).show();
        }
    });

    $( "#zidomotac" ).droppable({ //set container droppable
        drop: function( event, ui ) { //on drop
            ui.draggable.css({ //set absolute position of dropped object
                top: ui.position.top, left: ui.position.left
            }).appendTo('#zidomotac'); //append to container
        }
    });
});

    J'ai ajouté un drop de l'état de votre conteneur, de sorte que vous serez en mesure de faire glisser et de les déposer à l'intérieur.
    Ensuite, j'ai utilisé le drop événement qui me permet d'obtenir l'élément (ui.draggable) et la position (ui.position) de l'élément.

    J'ai donc mis sur la position absolue avec .css() puis ajouter le récipient avec .appendTo().

    Pour .draggable(), j'ai juste ajouté de démarrer et d'arrêter des événements pour afficher/masquer les éléments d'origine alors que le clone est caché/montré.

    CSS :

    /* Custom style for dropped element */
#zidomotac .slikezamenjanje { 
    position: absolute;
}

    Juste ajouté cette classe pour appliquer un style pour l'élément.

    Espère que je vous ai aidé 😉

    J'ai ajouté juste redimensionnable sur déplaçables par ici...jsfiddle.net/23vR5/1...
    Ah oui j'ai oublié ça. Est-ce possible autrement ?
    ya..je pense que oui..mais @Gorostas peut-il confirmer..
    Ah oui désolé, je pensais que vous étiez lui !! ^^
    Fonctionne comme un charme, merci man, je ne sais pas comment txanks beaucoup, j'ai spended trou de la journée pour le faire, txanks de nouveau. zalepime.com/zalepime_zid.html

    OriginalL'auteur risk