Passer de block à inline-block selon le media

Bonsoir.

Passer de block à inline-block selon le media

Quand tu parles de media, tu veux parler de la taille/résolution de l'écran ?

Oui exactement ;)
Voici mon code JS

$(function(){

    $('.sticky').each(function(){

        var parent = $(this).parent();
        var dTop = $(this).offset().top;
        var elem = $(this);
        var divTest = document.getElementById("essai");
        parent.css('position','relative');
        elem.css('position','absolute');
        if(window.matchMedia("(min-width:800px)").matches) {
            $(window).scroll(function(){
                if (scrollY()>dTop) {
                    elem.stop().animate({top:scrollY()-parent.offset().top},500);
                }else{
                    elem.stop().animate({top:dTop-parent.offset().top},500) 
                }
            });
            if (scrollY()>dTop) {
                elem.stop().animate({top:scrollY()-parent.offset().top},500);
            }

    }else{
        divTest.className = "petit";
        $( "#listaside" ).toggleClass( "listessai", addOrRemove );

    };

    });

});

function scrollY(){
    scrOfY = 0;
    if (typeof(window.pageYOffset) == 'number') {

        scrOfY = window.pageYOffset;
    }else if(document.body && (document.body.scrollTop)){
        scrOfY = document.body.scrollTop;
    }else if (document.documentElement && (document.documentElement.scrollTop)) {
        scrOfY = document.documentElement.scrollTop;
    }
    return scrOfY;
};

Si c'est pour changer des propriétés CSS selon la taille/résolution de l'écran de l'utilisateur, tu peux le faire tout simplement via les media queries en CSS, pas besoin de javascript pour ça.

Oui je sais mais c'est pour m'entrainer au JS ^^ j'ai trouvé la fonction qui permet de changer selon la taille du média mais je ne retrouve plus celle qui permet de modifier un display :/

Dans ce cas là, je préfère laisser quelqu'un d'autre te répondre, car je préfère largement passer par le CSS que par le javascript pour ce genre d'évènement, du coup, je ne m'y suis pas vraiment penché côté javascript.
Je n'utilise le javascript que pour ce que je ne peux pas faire uniquement avec le CSS.
Sur ce, bonne continuation et bonne soirée à toi. ;)

Merci Lartak11 :) bonne soirée à toi aussi

Oui Lud00 c'est ça mais sauf que ce n'est pas commandé au clic :/

Voici mon code html

<div class="col-xs-12 col-sm-2">
      <div class="sticky" id="essai">
        <ul id="asidegauche" class="list-unstyled">
          <li class="aside"><a href="index.php"><img src="medias/broadsound.png" alt="lienaccueil"/></a></li>
          <li class="aside"><a href="rock.php"><img src="medias/rock1.png" alt="lienrock" onmouseover="this.src='medias/rock2.png'" onmouseout="this.src='medias/rock1.png'"/></a></li>
          <li class="aside"><a href="electro.php"><img src="medias/electro.png" alt="lienelectro"></a></li>
          <li class="aside"><a href="pop.php"><img src="medias/pop.png" alt="lienpop"/></a></li>
        </ul>
      </div>
    </div>

Olmek, je te donnais juste un exemple d'utilisation pour la fonction ^^, je pensais que c'est ce que tu cherchais, tu n'as plus qu'a l'appliquer où tu veux ! Tu avais un autre soucis ? Tu arrives pourtant à détecter le changement de résolution non ?

Salut !

Tu peux utiliser les médias queries en javascript !
http://www.alsacreations.com/article/lire/1500-matchmedia-javascript-media-queries.html

Bisous et joyeux noel

J'ai essayé de l'appliquer mais sans résultat. Dans mon else j'ai mis

$("aside").css("display","inline-block");

Tu es sur que ce que tu veux, c'est un display inline-block et pas plutôt un display: inline (question bête mais on ne sait jamais ^^) ? Tu rentres bien dans ta condition (console.log) ?

Oui un inline serait plus approprié effectivement mais quand je regarde avec l'inspecteur, la valeur de display n'a pas changé

Earhater: merci mais c'est le système que j'ai utilisé ;) joyeyx noel à toi aussi

Ah oui ! Super ! Merci beaucoup LudOO !!

Bonne soirée, passez tous de bonnes fêtes ;)

De rien et bonne fêtes à toi aussi !