2009-11-14 7 views
1

J'ai un problème avec le plugin jquery redimensionnable. J'ai résolu le problème et j'ai trouvé cela. Si je crée un div et le rend redimensionnable et le rend aussi aussi unResize ça fonctionne très bien pour la plupart. Cependant, si je place le second div qui est aussiResize à margin: 0 auto cela ne fonctionne pas correctement. Le curseur de la souris sort de la partie où vous le redimensionnez. Voici donc un exemple de ce que je parle:Le curseur redimensionnable jquery ne se coince pas avec la marge auto

<div id="container"> 
    <div id="inside" style="margin:0 auto;"> 
    </div> 
</div> 

Le jquery:

$("#container").resizable({ alsoResize:"#inside" }); 

Si je prends l'auto dans la marge, il fonctionne très bien mais il y isnt travailler. Y at-il un moyen de faire ce travail ou juste une autre façon de centrer la page sans utiliser automatique?

+0

Quelqu'un sait-il comment résoudre ce problème? – ngreenwood6

Répondre

1

J'ai saisi le code de l'une des démos pour le plugin Resizeable et l'ai modifié pour faire ce que je pense que vous essayez d'accomplir. Si ce ne l'est pas, s'il vous plaît fournir un lien vers ce que vous avez, ou coller dans la page entière:

<!doctype html> 
<html lang="en"> 
<head> 
    <title>jQuery UI Resizable - Default functionality</title> 
    <link type="text/css" href="http://jqueryui.com/themes/base/ui.all.css" rel="stylesheet" /> 
    <script type="text/javascript" src="http://jqueryui.com/jquery-1.3.2.js"></script> 
    <script type="text/javascript" src="http://jqueryui.com/ui/ui.core.js"></script> 
    <script type="text/javascript" src="http://jqueryui.com/ui/ui.resizable.js"></script> 

    <link type="text/css" href="http://jqueryui.com/demos/demos.css" rel="stylesheet" /> 
    <style type="text/css"> 
     #container { width: 150px; height: 150px; } 
     #container #inside { height:100px; width:100px; margin:0 auto; background:#eee; } 
    </style> 
    <script type="text/javascript"> 
    $(function() { 
     $("#container").resizable({ alsoResize:"#inside" }); 
    }); 
    </script> 
</head> 

<body> 
    <div class="demo"> 
     <div id="container" class="ui-widget-content"> 
      <div id="inside"></div> 
     </div> 
    </div> 
</body> 

FYI - Je viens de tester ce dans Firefox et Safari sur Mac.

+0

ok alors comment cela résout mon problème du tout. C'est exactement ce que j'ai et quand vous déplacez le curseur, il ne reste pas sur le côté du conteneur. – ngreenwood6

+0

Désolé. Je ne peux pas voir ce qui se passe sur votre ordinateur. J'ai testé ce code dans Firefox et Safari sur un Mac et cela fonctionne correctement. Si vous êtes vraiment intéressé par une solution à votre problème, vous pouvez peut-être fournir plus d'informations. (c'est-à-dire: dans quels navigateurs cela se passe-t-il? Fournissez une capture d'écran) –

Questions connexes