jQuery slide-in texte

Je suis nouveau sur jQuery. Comment puis-je rendre le texte de la diapositive dans? J'ai essayé et ce 1) il ne fonctionne pas, et 2) je préfèrent glisser à partir du côté

$("#someId").html("hello").slideDown('slow');

OriginalL'auteur Roger | 2011-05-25

  1. 4

    Il est difficile de dire ce qui est mal, sans plus de renseignements, car il y a plusieurs points où les choses peuvent aller mal. Voici quelques possibilités:

    1. Si l'élément est déjà à montrer, de ne pas les animer.
    2. Si le jquery sélection finit pas de ramasser tous les éléments, vous ne pourrez pas voir quoi que ce soit. Est-il un élément avec l'id 'someId' dans votre arborescence DOM?

    Voici un exemple d'utilisation de slideDown:

    <!DOCTYPE html>
<html lang="en">
   <head>
     <script src="jquery.js" type="text/javascript"></script>
     <script type="text/javascript">
         $(document).ready(
             function() {
                 $("#someId").hide();
                 $("#someId").html("hello").slideDown('slow');
         });
     </script>
  </head>
  <body>
      <div id="someId"></div>
  </body>
</html>
    dyoo, Merci pour cet exemple; je peux le voir de travaux et plus précisément je vois que le html...slidedown syntaxe fonctionne aussi bien. Je pense que mon erreur a été de ne pas placer la ligne de code dans le document...prêt...fonction. Une chose curieuse, c'est que le mot "bonjour" est injecté dans le html, mais le slidedown fonction ne fonctionne Pas. En fait j'ai été refaire un vieux script que j'ai écrit en JavaScript où cette déclaration est à l'intérieur d'un if/else. Je pense que j'ai pour déplacer l'ensemble du si/d'autre et peut-être l'ensemble du script dans le document...prêt...fonction.

    OriginalL'auteur dyoo

  2. 1
    $("#someId").html("hello").show('slide');

    Violon: http://jsfiddle.net/maniator/6LB8M/

    OriginalL'auteur Neal

  3. 1

    Découvrez la fonction animate, il vous donnera beaucoup plus de flexibilité:

    http://api.jquery.com/animate/

    Vous aurez envie de faire la modification soit de la marge ou de la position x /y...quelque chose comme ceci:

    $('#someID').html("hello").animate({
  left: '+=50',
}, 1000, function() {
  //Animation complete.
});

    Cela signifie que #someID aura une animation appliquée dans lequel la position des éléments sur l'axe des x sera augmenté de 50 pixels, et il se passera plus de 1 seconde.

    OriginalL'auteur Calvin Froedge

  4. 1

    CSS:

    #someId

{
    width:100px;
    margin-left:-100px;
}

    jQuery

    $('div').animate({marginLeft:"0"},1500);

    Voir ici http://jsfiddle.net/v8XFn/

    OriginalL'auteur Jishnu A P

  5. 1

    1 - peut-être qu'il doit être caché à l'avance? c'est à dire:

    #someId { display: none }

    2 - Vous pouvez animer la largeur du conteneur. Donc, si votre conteneur a une largeur égale à zéro, l'animer à 250 pixels de largeur (ou autre).

    $('#someId').animate({
    width: '250',
}, 5000, function() {
    //Animation complete.
});

    http://api.jquery.com/animate/

    oui - si vous mettez un hide() avant votre slidedown, il fonctionnera

    OriginalL'auteur karim79

  6. 1

    Cela peut fonctionner très bien. 

    $(".inner").mouseover(function(){
  $(".inner").animate({"marginLeft": "-=100px"}, "slow");
});

$(".inner").mouseout(function(){
  $(".inner").animate({"marginLeft": "+=100px"}, "slow");
});

    La voir à l'œuvre ici: http://jsfiddle.net/R4Xyd/5/

    OriginalL'auteur user624385

  7. 0

    Vous pouvez animer la position. Vous devriez obtenir quelque chose comme ceci:

    html:

    <p id="animated_text">text to be animated</p>

    css:

    p {
position: abosulte;
left: 0;
}

    jquery:

    $("#animated_text").animate({'left': '+=200'}, 1000);

    OriginalL'auteur Máthé Endre-Botond

  8. 0

    Obtenir le jQuery-plugin easing et l'ajouter à votre fichier

    <script src="script/jquery.easing.1.3.js" type="text/javascript"></script>
--and do this--
$('#yourDiv').delay(3000).effect('slide', { direction: "right" });

    OriginalL'auteur ta-run