198 뷰
[Tuto] - Flèche retour en haut de la page
Zaekof

38 과목, 883 개

참여자 기증자
읽지 않은 메시지
Bonjour à tous,
Aujourd'hui nouveau tuto pour vous montrer comment ajouter/installer une flèche qui remonte en haut du site quand on appuie dessus quand on se trouve en bas ou milieu du site.

Déjà il vous faut créer un overrides comme ceci :

./overrides/themes/dungeon/views/body.tpl.php
/overrides/themes/dungeon/css/style.css

body.tpl.php :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript">
</script>

<script src="http://sd-1.archive-host.com/membres/up/3347790973941088/easing.js" type="text/javascript">
</script>

<script src="http://sd-1.archive-host.com/membres/up/3347790973941088/jqueryuitotop.js" type="text/javascript">
</script>

<script type="text/javascript">
//<![CDATA[
$.noConflict();
jQuery(document).ready(function() {
jQuery().UItoTop({ easingType: 'easeOutQuart' });
});
//]]>
</script>


style.css :

#toTop {
display:none;
text-decoration:none;
position:fixed;
bottom:20px;
right:20px;
overflow:hidden;
width:51px;
height:51px;
border:none;
text-indent:-999px;
background-image: url(http://sd-1.archive-host.com/membres/images/3347790973941088/uitotop.png);
background-repeat: no-repeat;
background-position: left top;

}

#toTopHover {
background:url(http://sd-1.archive-host.com/membres/images/3347790973941088/uitotop.png) no-repeat left -51px;
width:51px;
height:51px;
display:block;
overflow:hidden;
float:left;
opacity: 0;
-moz-opacity: 0;
filter:alpha(opacity=0);
}

#toTop:active, #toTop:focus {
outline:none;
}


archive complète :
https://mega.nz/#!Oxhz3bwL…

Screens :





Si vous avez des problème avec vos background faite comme ceci dans votre css :

body {
background-image: url('<?php echo $NeoFrag->config->dungeon_background ? path($NeoFrag->config->dungeon_background) : '/themes/dungeon/images/backgrounds/default.jpg'; ?>');

"N'arrêtez jamais d'apprendre" !
7 참가자
21 개
eResnova

17 과목, 875 개

참여자
읽지 않은 메시지
Non justement :)

  • ./overrides/themes/default/css/style.css
  • ./overrides/themes/default/views/body.tpl.php
amir_games

17 과목, 132 개

기증자
읽지 않은 메시지
@eResnova je vais me mettre en PLS :(
Gérant de la communauté Inferia Gaming
Vic Vipers

1 과목 , 19 개

읽지 않은 메시지
Pour le chemin d’accès c'est ok, et de mon côté ça marche sans problème pour les deux thèmes. As-tu apporté des modifications aux fichiers style.css et body.tpl.php ou sont-ils d'origines? Si tu le souhaite tu peux me les faire parvenir en mp et je test de mon côté pour voir ce qui cloche.
amir_games

17 과목, 132 개

기증자
읽지 않은 메시지
@Vic Vipers j'ai transférer les fichiers d'origine dans l'override puis j'ai modifier ceux ci comme indiquer dans le tuto.
Gérant de la communauté Inferia Gaming
Vic Vipers

1 과목 , 19 개

읽지 않은 메시지
amir_games, pour ma part le btn apparait immédiatement lorsque la page défile vers le bas pour les deux thèmes. Il doit y avoir une erreur de frappe quelque part ou alors je ne vois pas... A moins de tester tes fichiers moi même je ne vois pas comment t'apporter mon aide. :(
Vic Vipers

1 과목 , 19 개

읽지 않은 메시지
J'ai rencontrer un problème en intégrant un spoiler html pour l'utiliser dans un widget, celui ci utilise également un javascript. L'utilisation du spoiler fonctionne sans problème mais le btn haut de page lui n'apparait plus. Une fois retirer il apparait à nouveau.

J'en est donc conclu à un conflit entre les deux scripts. J'ai réglé ce problème de mon côté, à voir si ce n'est pas la même chose chez toi. ;)