Bienvenue sur le forum d'entraide d'OverBlog.
Nous vous conseillons de chercher une réponse sur notre base de connaissances avant de poster une demande sur le forum.
[RÉSOLU] Mettre une flèche ascenseur
  • Bonjour Mehdi, bonjour Kinou. Voilà, je voudrais mettre une flèche "ascenseur", pas seulement sur un article mais sur tout le blog, et il n'y a plus de html dans les modules, je pense qu'il me faut entrer dans le code.
    J'ai les lignes qu'il me faut ajouter :
    <a href="#" style="bottom: 5px; display: scroll; position: fixed; right: 5px;" title="Subir arriba"><img src="AQUÍ LA URL DE TU IMAGEN" /></a>.
    mais je ne sais pas où les placer dans le code. Pouvez-vous m'aider ? - Un grand merci d'avance et bonne journée.

  • Bonjour, 

    si c'est sur ce blog : 
    http://papier-de-verre.over-blog.com/

    il y a déjà une flèche en bas à droite qui permet de remonter en haut de page.

  • Bonjour Kinou, oui mais c'est une flèche dont le code est dans le dernier article. Et je voudrais que la flèche soit valable pour tout le blog.
  • Bonjour Thaddée,

    Tu peux mettre directement ton bloc <div> ... </div> dans le HTML du blog entre  <footer id="blog-footer"> et </footer>
    Je l'ai fait, ça marche nickel.
    Mais je vois que tu n'as plus de footer entre la pagination et la ligne des CGU, il faudrait que tu le remettes, ne serait-ce que pour ta flèche.
    :)
  • Merci  pour ta réponse Bénédicte, par contre je ne sais pas comment mettre le footer ... Je ne l'ai pas enlevé.  Je vais aller jeter un coup d’œil au code. Ta flèche est chouette :-) Merci encore et bon week-end !
  • Je ne trouve pas  :(( !!!
  • Bonjour

    Me concernant je suis passé par un javascript associé à la bibliotheque jquery qui permet une remontée plus lente du bouton "scrolltotop"


    la partie à insérer dans le css  ( avant "style" ou ou tu veux mais dans le css)

    #scrollToTop a {
        background: rgba(255, 255, 255, 0) url(" http://idata.over-blog.com/2/25/98/74/01-juin-2012/63562981.png ") no-repeat scroll 0 0;
        bottom: 10px;
        padding: 250px 60px;
        position: fixed;
        right: 8px;
    }
    #scrollToTop a:hover {
        background: rgba(255, 255, 255, 0) url(" http://idata.over-blog.com/2/25/98/74/01-juin-2012/63562978.png") no-repeat scroll 0 0;
        padding: 250px 60px;
    }

    ______________

    j'ai mis un padding de 250 px qui met le bouton a peu prés au centre du blog...il apparaît uniquement quand on fait défiler la page vers le bas (c'est réglable)

    _____________________


    la partie a insérer tout en bas du code dans la partie "script"


    </script><script type="text/javascript">
    // <![CDATA[
    $(window).scroll(function() {

    if($(window).scrollTop() == 0){

    $('#scrollToTop').fadeOut("fast");

    } else {

    if($('#scrollToTop').length == 0){

    $('body').append('<div id="scrollToTop">'+

    '<a href="#" _mce_href="#"><\/a>'+

    '<\/div>');

    }

    $('#scrollToTop').fadeIn("fast");

    }

    });

    $('#scrollToTop a').live('click', function(event){

    event.preventDefault();

    $('html,body').animate({scrollTop: 0}, 'slow');

    });
    // ]]>
    </script>

    _________________


    visible ici


    le bouton apparaît quand on a commencer a faire défiler vers le bas le curseur

    tu peux bien sur choisir une autre image de bouton (la il y en a 2.....1 qui apparaît et 1 en "hover" quand la souris se pose dessus


  • Re !

    Ah oui, il n’y a ni footer ni display: none dans ton CSS, c’est peut-être parce que tu as importé ton blog d’ailleurs ?
    Et d’après ce que tu dis, tu n’as pas d’accès au html de modules libres ??
    (c’est pourquoi je t’avais proposé de mettre la flèche dans le footer, mais un module fait mieux l’affaire, c’est plus accessible et on risque moins de péter le blog si on se trompe)

    Bon, pour ta flèche, tu peux tenter de le mettre dans le HTML du module Newsletter par exemple, en mettant ton <div> … </div> juste après <div class="widget subscribe">

    Au cas où, fait bien une copie de tout ton CSS ! :)

  • Ah, j'avais pas vu la solution de Mehdi ! :)
  • Ah merci, je vais étudier ça de plus près et je vous tiens au courant, merci Mehdi, merci Bénédicte !
  • Ca marche Mehdi, un grand merci ! Merci aussi Bénédicte, bonne journée à vous deux !
  • PS : j'aimerais bien qu'elle soit un peu plus bas, c'est possible ?

  • C'est bon, je vois ta flèche au défilement......    ^:)^   ^:)^


  • oui, reduit le 250 px du padding il me semble

    padding "marge interne"
  • en test a 100 px de padding , la flêche est en bas
  • Ah merci, tu es génial  >:D<