Page d'Accueil avec une slide
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Page d'Accueil avec une slide
Détails techniques
Version du forum : phpBB2Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Capture d'écran du problème :
- Voir l'image:
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : A son origine
Lien du forum : (lien masqué, vous devez poster pour le voir) (le forum est créé, mais nous n'avons encore rien commencé dessus. C'est d'ailleurs pour ça qu'il est en hide)
Description du problème
Bonjour à tous,Afin de créer mon nouveau projet, je rencontre un petit problème pour un codage que j'aimerai beaucoup réaliser. Malheureusement, je trouve beaucoup de tutos soit en Anglais, soit pas totalement comme je le voudrais. Et je n'ai pas les connaissances suffisantes en javascript ou en jquery pour faire ce que je veux.
De ce fait, je viens trouver une âme charitable qui pourra m'aider pour le code.
Il s'agira donc d'une PA avec une image de fond, sur lequel j'aimerai mettre une slide dans un cadre qui contiendra de nombreuses informations sur le forum. Les flèches cliquables permettant d'aller à droite ou à gauche pour toutes les infos.
Je glisse ci-dessous dans le spoiler un forum qui possède ce type de codage, qui devient de plus en plus célèbre.
- le forum exemple:
(je précise que je ne veux pas l'effet du survol, mais uniquement une slide à mettre sur une image de fond.)
Un énorme merci par avance à celles et ceux qui m'aideront
Bonne soirée et à bientôt !
Re: Page d'Accueil avec une slide
Hi !
Je lance un petit up
Je lance un petit up
Re: Page d'Accueil avec une slide
Hello !
Je relance le sujet Je cherche de mon côté si j'en trouve des faciles à réaliser, si jamais vous avez des pistes aussi, je suis prête à faire aussi et à me faire corriger quoi
Je relance le sujet Je cherche de mon côté si j'en trouve des faciles à réaliser, si jamais vous avez des pistes aussi, je suis prête à faire aussi et à me faire corriger quoi
Re: Page d'Accueil avec une slide
Hello !
Je relance, toujours besoin d'aide !
edit: j'ai essayé d'avancer de mon côté.
J'ai réussi à réaliser un tuto et j'ai donc un bon début de code. Maintenant, la mise en place reste chaotique car je suis partie (selon le tuto) d'une page HTML et là, quand j'essaye d'installer sur la page d'accueil, le javascript d'un côté et le css de l'autre, tout cafouille
Donc si quelqu'un peut m'aider à passer de la page HTML pour la page d'accueil.
Et aussi, si possible, à faire un effet de transition pour le passage de chaque bloc dans la slide. Genre un effet de glissement ou limite parallax
Voilà, je mets mon code en attendant
Je relance, toujours besoin d'aide !
edit: j'ai essayé d'avancer de mon côté.
J'ai réussi à réaliser un tuto et j'ai donc un bon début de code. Maintenant, la mise en place reste chaotique car je suis partie (selon le tuto) d'une page HTML et là, quand j'essaye d'installer sur la page d'accueil, le javascript d'un côté et le css de l'autre, tout cafouille
Donc si quelqu'un peut m'aider à passer de la page HTML pour la page d'accueil.
Et aussi, si possible, à faire un effet de transition pour le passage de chaque bloc dans la slide. Genre un effet de glissement ou limite parallax
Voilà, je mets mon code en attendant
- le code:
- Code:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1"><meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style>
* {box-sizing: border-box}
.mySlides1 {display: none;}
img {vertical-align: middle;}
/* Slideshow container */
.slideshow-container {
max-width: 352px;
max-height: 418px;
position: relative;
margin: auto;
}
/* Next & previous buttons */
.prev, .next {
cursor: pointer;
position: absolute;
top: -320px;
width: auto;
padding: 5px;
margin-top: -22px;
transition: 0.6s ease;
user-select: none;
}
/* Position the "next button" to the right */
.next {
right: 0;
border-radius: 3px 0 0 3px;
}
/* On hover, add a grey background color */
/.prev:hover, .next:hover {
background-color: #f1f1f1;
color: black;
}
#PADB{
width: 800px;
height: 600px;
margin: auto;
position: relative; z-index: 6;
}
/*--cadre principal--*/
PADB-cadre-p, .mySlides1{
position: absolute;
width: 352px;
height:418px;
padding: 5px;
hyphens: auto;}
#PADB-cadre, .mySlides1 td{background: none;}
#PADB-cadre, .mySlides1 {top: -508px;left:0px;}
.test{width: 310px; height: 200px; text-align: justify; font-size: 12px; overflow: auto;}
</style>
</head>
<body>
<!-- -- PA DOL BARAN -- -->
<div id="PADB">
<div style="background-image: url('https://images2.imgbox.com/c1/07/7GJIUIzK_o.png'); background-repeat: no-repeat; width:800px; height:600px;">
<img border="0" style="width: 800px; height: 600px;" usemap="#PADB-liens" src="https://images2.imgbox.com/94/6e/Rqk8sywy_o.png" />
<map id="PADB-liens"> <area shape="rect" coords="523,197,641,223" target="_blank" href="http://vancouver-rpg.forumactif.com/t29-o-reglement-o-le-bon-deroulement" /></map>
</div>
<div id="PADB-cadre" class="PADB-cadre-p" style=""><div class="slideshow-container">
<div class="mySlides1"><center><h2>Bienvenue sur Dol Baran</h2>
<div class="test mCustomScrollbar" data-mcs-theme="minimal">Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette,
sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o
à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger.
Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette,
sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o
à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger.
Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette,
sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o
à la belette, sur un oranger. Mon petit oiseau sur un oranger, sur un o à la belette, sur un o à la belette, sur un oranger.</div> </center></div>
<div class="mySlides1"><center><div class="bienvenue">yihaaaaaaaaaaaa</div></center></div>
<div class="mySlides1"><center><div class="bienvenue">mamamamamamamama</div></center></div>
<a class="prev" onclick="plusSlides(-1, 0)"><img src="https://images2.imgbox.com/47/1f/xwCPUeo5_o.gif" /></a>
<a class="next" onclick="plusSlides(1, 0)"><img src="https://images2.imgbox.com/47/1f/xwCPUeo5_o.gif" /></a>
</div></div>
</div>
<script>
var slideIndex = [1,1];
var slideId = ["mySlides1"]
showSlides(1, 0);
showSlides(1, 1);
function plusSlides(n, no) {
showSlides(slideIndex[no] += n, no);
}
function showSlides(n, no) {
var i;
var x = document.getElementsByClassName(slideId[no]);
if (n > x.length) {slideIndex[no] = 1}
if (n < 1) {slideIndex[no] = x.length}
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
x[slideIndex[no]-1].style.display = "block";
}
</script>
</body>
</html>
Re: Page d'Accueil avec une slide
Je reviens avec un UP
Alors, j'ai bien avancé toute seule comme une grande hihi. J'ai réussi à faire ma slide, à l'installer dans ma page d'accueil. Mais du coup, j'ai dû mettre le javascript au même endroit. Est-ce qu'il y a une méthode pour le mettre dans les scripts et pas directement avec le code HTML ?
Ensuite, j'aimerai qu'on m'aide pour modifier la transition un peu barbare et faire plus glissement...
Et j'aimerai savoir s'il est possible d'intégrer des onglets dans une slide ou ça va faire conflit ?
Merci encore !
Je poste les codes
Alors, j'ai bien avancé toute seule comme une grande hihi. J'ai réussi à faire ma slide, à l'installer dans ma page d'accueil. Mais du coup, j'ai dû mettre le javascript au même endroit. Est-ce qu'il y a une méthode pour le mettre dans les scripts et pas directement avec le code HTML ?
Ensuite, j'aimerai qu'on m'aide pour modifier la transition un peu barbare et faire plus glissement...
Et j'aimerai savoir s'il est possible d'intégrer des onglets dans une slide ou ça va faire conflit ?
Merci encore !
Je poste les codes
- le codage:
- Code:
/*------------------ PAGE D ACCUEIL ------------------*/
.mySlides1 {display: none;}
img {vertical-align: middle;}
/* Slideshow container */
.slideshow-container {
max-width: 352px;
max-height: 418px;
position: relative;
margin: auto;
}
/* Next & previous buttons */
.prev, .next {
cursor: pointer;
position: absolute;
top: -320px;
width: 352px;
padding: 16px;
margin-top: -22px;
color: red;
font-weight: bold;
font-size: 18px;
transition: 0.6s ease;
user-select: none;
}
.prev{left: -180px;}
.next{left: 148px;}
/* Position the "next button" to the right */
.next {
right: 0;
border-radius: 3px 0 0 3px;
}
#PADB{
width: 800px;
height: 600px;
margin: auto;
position: relative; z-index: 6;
}
/*--cadre principal--*/
PADB-cadre-p, .mySlides1{
position: absolute;
width: 352px;
height:418px;
hyphens: auto;}
#PADB-cadre, .mySlides1 td{background: none;}
#PADB-cadre, .mySlides1 {top: -508px;left:0px;}
.bienvenue{width: 288px; height: 383px; font-size: 12px; text-align: justify; hypens: auto; scroll: auto; margin-top: 12px;}
/*-------------------- FIN PA -------------------*/
- Code:
<!-- -- PA DOL BARAN -- -->
<div id="PADB">
<div style="background-image: url('https://images2.imgbox.com/1a/86/jPjuDt67_o.png'); background-repeat: no-repeat; width:800px; height:600px;">
<img border="0" src="https://images2.imgbox.com/94/6e/Rqk8sywy_o.png" usemap="#PADB-liens" style="width: 800px; height: 600px;" />
</div>
<div style="" class="PADB-cadre-p" id="PADB-cadre">
<div class="slideshow-container">
<div class="mySlides1">
<center>
<div class="bienvenue mCustomScrollbar" data-mcs-theme="minimal">
<center>
<img style="margin-bottom: 5px;" src="https://images2.imgbox.com/23/81/HW4EYaoL_o.png" />
</center>
La nouvelle se répandit rapidement dans les contrées, les Dieux étaient parmi eux et Valkar se retrouva au centre de toutes les attentions. Adulé, prié plus que les autres, il gagna le cœur des peuples qui foulaient la terre de Dol Baran et se vit proposer de devenir le souverain de tous. L’idée n’était pas déplaisante aux yeux du Dieu de la mort. Le pouvoir sur les créations de son frère Ardar serait établi et personne ne pourrait plus le contester. Il n’en fallut pas plus pour qu’il accepte, devenant officiellement le Grand Roi de Dol Baran. Sa première action fut de diviser le monde en contrées. Bien qu’il fût un Dieu et qu’il lui aurait été aisé de gouverner un monde aussi vaste, il préféra donner le pouvoir à certaines grandes familles qu’il jugeait dignes de lui, espérant secrètement et pour lui-même qu’elles en fassent « mauvais usage ». Il s’installa sur les terres de Shora, une contrée au nord-ouest du monde, et fit construire une forteresse faite avec des pierres sombres des volcans, solide et robuste, à l’épreuve du climat rude qui régnait sur cette région. Au début de son règne Valkar ne se montra pas avide de pouvoir, cachant ses desseins à son frère, Khadgar, resté près de lui pour le soutenir. Le Roi respectait les lois de son père ; ne pas intervenir. Et il se félicitait de ne pas l'avoir fait, après tout il avait juste accepté l'offre par ceux qui vivaient sur l’Éden qu’il avait conçu avec les paires, rien de plus.
</div>
</center>
</div>
<div class="mySlides1">
<center>
<div class="bienvenue">
yihaaaaaaaaaaaa
</div>
</center>
</div>
<div class="mySlides1">
<center>
<div class="bienvenue">
mamamamamamamama
</div>
</center>
</div>
<a onclick="plusSlides(-1, 0)" class="prev"><img alt="gauche" src="https://images2.imgbox.com/eb/eb/2qTaeULs_o.png" /></a><a onclick="plusSlides(1, 0)" class="next"><img alt="droite" src="https://images2.imgbox.com/5b/0b/UGrtfx4N_o.png" /></a>
</div>
</div>
</div>
<script>
var slideIndex = [1,1];
var slideId = ["mySlides1"]
showSlides(1, 0);
showSlides(1, 1);
function plusSlides(n, no) {
showSlides(slideIndex[no] += n, no);
}
function showSlides(n, no) {
var i;
var x = document.getElementsByClassName(slideId[no]);
if (n > x.length) {slideIndex[no] = 1}
if (n < 1) {slideIndex[no] = x.length}
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
x[slideIndex[no]-1].style.display = "block";
}
</script>
Re: Page d'Accueil avec une slide
Et un nouveau up
Re: Page d'Accueil avec une slide
Up
Toujours d'actu
Toujours d'actu
Re: Page d'Accueil avec une slide
Hi ! Toujours d'actu, donc nouveau up
Re: Page d'Accueil avec une slide
Hello Cheeralex,
ton script va te donner des complications par la suite.
Je me suis basé sur ce Slide:
https://codepen.io/doodlemarks/pen/aFcly
Et j'ai essayé de l'adapter avec ton image de fond, les flèches seront positionnées en haut car sur le coté cela pose pas mal de soucis.
La c.s.s:
Le code html dans la page d'accueil:
Et enfin le script a placer sur l'index:
Le plugin est fonctionnel et se base sur la hauteur/largeur de la balise "li" donc voilà pourquoi les flèches ne pourront pas être positionnées au centre,tu peux ajouter un margin-left négatif,
ces dernières disparaitront.
Et voilou .
a++
ton script va te donner des complications par la suite.
Je me suis basé sur ce Slide:
https://codepen.io/doodlemarks/pen/aFcly
Et j'ai essayé de l'adapter avec ton image de fond, les flèches seront positionnées en haut car sur le coté cela pose pas mal de soucis.
La c.s.s:
- Code:
#slider {
position: relative;
overflow: hidden;
margin: 20px auto 0 auto;
border-radius: 4px;
}
#slider ul {
position: relative;
top: 130px;
margin: 0;
padding: 0;
height: 200px;
list-style: none;
}
#slider ul li {
position: relative;
display: block;
float: left;
text-align:left;
width:280px;
height:550px;
overflow-y: auto;
}
#slider ul li div
{
color:white;
}
a.control_prev, a.control_next {
position: absolute;
top:17%;
z-index: 999;
display: block;
padding: 4% 3%;
width: 16px;
height: 24px;
cursor: pointer;
}
a.control_prev {margin-left:-10px;}
a.control_next {right: 0;margin-right:-10px;}
Le code html dans la page d'accueil:
- Code:
<div style="background-image: url('https://images2.imgbox.com/1a/86/jPjuDt67_o.png'); background-repeat: no-repeat; width:800px; height:600px;">
<div id="slider">
<a class="control_next"><img alt="droite" src="https://images2.imgbox.com/5b/0b/UGrtfx4N_o.png" /></a> <a class="control_prev"><img alt="gauche" src="https://images2.imgbox.com/eb/eb/2qTaeULs_o.png" /></a>
<ul>
<li>
<div>
La nouvelle se répandit rapidement dans les contrées, les Dieux étaient parmi eux et Valkar se retrouva au centre de toutes les attentions. Adulé, prié plus que les autres, il gagna le cœur des peuples qui foulaient la terre de Dol Baran et se vit proposer de devenir le souverain de tous. L’idée n’était pas déplaisante aux yeux du Dieu de la mort. Le pouvoir sur les créations de son frère Ardar serait établi et personne ne pourrait plus le contester. Il n’en fallut pas plus pour qu’il accepte, devenant officiellement le Grand Roi de Dol Baran. Sa première action fut de diviser le monde en contrées. Bien qu’il fût un Dieu et qu’il lui aurait été aisé de gouverner un monde aussi vaste, il préféra donner le pouvoir à certaines grandes familles qu’il jugeait dignes de lui, espérant secrètement et pour lui-même qu’elles en fassent « mauvais usage ». Il s’installa sur les terres de Shora, une contrée au nord-ouest du monde, et fit construire une forteresse faite avec des pierres sombres des volcans, solide et robuste, à l’épreuve du climat rude qui régnait sur cette région. Au début de son règne Valkar ne se montra pas avide de pouvoir, cachant ses desseins à son frère, Khadgar, resté près de lui pour le soutenir. Le Roi respectait les lois de son père ; ne pas intervenir. Et il se félicitait de ne pas l'avoir fait, après tout il avait juste accepté l'offre par ceux qui vivaient sur l’Éden qu’il avait conçu avec les paires, rien de plus.
</div>
</li>
<li>
<div>
SLIDE 4 La nouvelle se répandit rapidement dans les contrées, les Dieux étaient parmi eux et Valkar se retrouva au centre de toutes les attentions. Adulé, prié plus que les autres, il gagna le cœur des peuples qui foulaient la terre de Dol Baran et se vit proposer de devenir le souverain de tous. L’idée n’était pas déplaisante aux yeux du Dieu de la mort. Le pouvoir sur les créations de son frère Ardar serait établi et personne ne pourrait plus le contester. Il n’en fallut pas plus pour qu’il accepte, devenant officiellement le Grand Roi de Dol Baran. Sa première action fut de diviser le monde en contrées. Bien qu’il fût un Dieu et qu’il lui aurait été aisé de gouverner un monde aussi vaste, il préféra donner le pouvoir à certaines grandes familles qu’il jugeait dignes de lui, espérant secrètement et pour lui-même qu’elles en fassent « mauvais usage ». Il s’installa sur les terres de Shora, une contrée au nord-ouest du monde, et fit construire une forteresse faite avec des pierres sombres des volcans, solide et robuste, à l’épreuve du climat rude qui régnait sur cette région. Au début de son règne Valkar ne se montra pas avide de pouvoir, cachant ses desseins à son frère, Khadgar, resté près de lui pour le soutenir. Le Roi respectait les lois de son père ; ne pas intervenir. Et il se félicitait de ne pas l'avoir fait, après tout il avait juste accepté l'offre par ceux qui vivaient sur l’Éden qu’il avait conçu avec les paires, rien de plus. SLIDE 4 La nouvelle se répandit rapidement dans les contrées, les Dieux étaient parmi eux et Valkar se retrouva au centre de toutes les attentions. Adulé, prié plus que les autres, il gagna le cœur des peuples qui foulaient la terre de Dol Baran et se vit proposer de devenir le souverain de tous. L’idée n’était pas déplaisante aux yeux du Dieu de la mort. Le pouvoir sur les créations de son frère Ardar serait établi et personne ne pourrait plus le contester. Il n’en fallut pas plus pour qu’il accepte, devenant officiellement le Grand Roi de Dol Baran. Sa première action fut de diviser le monde en contrées. Bien qu’il fût un Dieu et qu’il lui aurait été aisé de gouverner un monde aussi vaste, il préféra donner le pouvoir à certaines grandes familles qu’il jugeait dignes de lui, espérant secrètement et pour lui-même qu’elles en fassent « mauvais usage ». Il s’installa sur les terres de Shora, une contrée au nord-ouest du monde, et fit construire une forteresse faite avec des pierres sombres des volcans, solide et robuste, à l’épreuve du climat rude qui régnait sur cette région. Au début de son règne Valkar ne se montra pas avide de pouvoir, cachant ses desseins à son frère, Khadgar, resté près de lui pour le soutenir. Le Roi respectait les lois de son père ; ne pas intervenir. Et il se félicitait de ne pas l'avoir fait, après tout il avait juste accepté l'offre par ceux qui vivaient sur l’Éden qu’il avait conçu avec les paires, rien de plus.
</div>
</li>
<li>
<div>
SLIDE 3
</div>
</li>
<li>
<div>
SLIDE 4
</div>
</li>
</ul>
</div>
</div>
Et enfin le script a placer sur l'index:
- Code:
jQuery(document).ready(function ($) {
var slideCount = $('#slider ul li').length;
var slideWidth = $('#slider ul li').width();
var slideHeight = $('#slider ul li').height();
var sliderUlWidth = slideCount * slideWidth;
$('#slider').css({ width: slideWidth, height: slideHeight });
$('#slider ul').css({ width: sliderUlWidth, marginLeft: - slideWidth });
$('#slider ul li:last-child').prependTo('#slider ul');
function moveLeft() {
$('#slider ul').animate({
left: + slideWidth
}, 200, function () {
$('#slider ul li:last-child').prependTo('#slider ul');
$('#slider ul').css('left', '');
});
};
function moveRight() {
$('#slider ul').animate({
left: - slideWidth
}, 200, function () {
$('#slider ul li:first-child').appendTo('#slider ul');
$('#slider ul').css('left', '');
});
};
$('a.control_prev').click(function () {
moveLeft();
});
$('a.control_next').click(function () {
moveRight();
});
});
Le plugin est fonctionnel et se base sur la hauteur/largeur de la balise "li" donc voilà pourquoi les flèches ne pourront pas être positionnées au centre,tu peux ajouter un margin-left négatif,
ces dernières disparaitront.
Et voilou .
a++
Invité- Invité
Re: Page d'Accueil avec une slide
Coucou !
Ouah un grand merci pour ton aide et cette slide avec une transition plus sympa que la mienne. C'est trop beau !!!
Le seul souci, c'est que les flèches en haut me posent problème. C'est prévu qu'elle soit de chaque côté du cadre pour une question plus esthétique. Il n'y a vraiment aucun moyen de les placer sur le côté comme le tutoriel de base ?
J'ai installé ton code et ça marche nickel, reste juste la possibilité des flèches. Mais déjà, un énoooooooooorme merci
Ouah un grand merci pour ton aide et cette slide avec une transition plus sympa que la mienne. C'est trop beau !!!
Le seul souci, c'est que les flèches en haut me posent problème. C'est prévu qu'elle soit de chaque côté du cadre pour une question plus esthétique. Il n'y a vraiment aucun moyen de les placer sur le côté comme le tutoriel de base ?
J'ai installé ton code et ça marche nickel, reste juste la possibilité des flèches. Mais déjà, un énoooooooooorme merci
Re: Page d'Accueil avec une slide
Re,
de rien chère amie .
Alors , c'est du bidouillage , mais remplaces le code html par celui-ci:
Puis dans la feuille de style, repère ceci:
Supprimes et remplaces par:
Il y aura surement des ajustements a effectuer mais c'est fonctionnel .
a++
de rien chère amie .
Alors , c'est du bidouillage , mais remplaces le code html par celui-ci:
- Code:
<div style="background-image: url('https://images2.imgbox.com/1a/86/jPjuDt67_o.png'); background-repeat: no-repeat; width:800px; height:600px;">
<a class="control_next"><img src="https://images2.imgbox.com/5b/0b/UGrtfx4N_o.png" alt="droite" /></a> <a class="control_prev"><img src="https://images2.imgbox.com/eb/eb/2qTaeULs_o.png" alt="gauche" /></a>
<div id="slider">
<ul>
<li>
<div>
La nouvelle se répandit rapidement dans les contrées, les Dieux étaient parmi eux et Valkar se retrouva au centre de toutes les attentions. Adulé, prié plus que les autres, il gagna le cœur des peuples qui foulaient la terre de Dol Baran et se vit proposer de devenir le souverain de tous. L’idée n’était pas déplaisante aux yeux du Dieu de la mort. Le pouvoir sur les créations de son frère Ardar serait établi et personne ne pourrait plus le contester. Il n’en fallut pas plus pour qu’il accepte, devenant officiellement le Grand Roi de Dol Baran. Sa première action fut de diviser le monde en contrées. Bien qu’il fût un Dieu et qu’il lui aurait été aisé de gouverner un monde aussi vaste, il préféra donner le pouvoir à certaines grandes familles qu’il jugeait dignes de lui, espérant secrètement et pour lui-même qu’elles en fassent « mauvais usage ». Il s’installa sur les terres de Shora, une contrée au nord-ouest du monde, et fit construire une forteresse faite avec des pierres sombres des volcans, solide et robuste, à l’épreuve du climat rude qui régnait sur cette région. Au début de son règne Valkar ne se montra pas avide de pouvoir, cachant ses desseins à son frère, Khadgar, resté près de lui pour le soutenir. Le Roi respectait les lois de son père ; ne pas intervenir. Et il se félicitait de ne pas l'avoir fait, après tout il avait juste accepté l'offre par ceux qui vivaient sur l’Éden qu’il avait conçu avec les paires, rien de plus.
</div>
</li>
<li>
<div>
SLIDE 4 La nouvelle se répandit rapidement dans les contrées, les Dieux étaient parmi eux et Valkar se retrouva au centre de toutes les attentions. Adulé, prié plus que les autres, il gagna le cœur des peuples qui foulaient la terre de Dol Baran et se vit proposer de devenir le souverain de tous. L’idée n’était pas déplaisante aux yeux du Dieu de la mort. Le pouvoir sur les créations de son frère Ardar serait établi et personne ne pourrait plus le contester. Il n’en fallut pas plus pour qu’il accepte, devenant officiellement le Grand Roi de Dol Baran. Sa première action fut de diviser le monde en contrées. Bien qu’il fût un Dieu et qu’il lui aurait été aisé de gouverner un monde aussi vaste, il préféra donner le pouvoir à certaines grandes familles qu’il jugeait dignes de lui, espérant secrètement et pour lui-même qu’elles en fassent « mauvais usage ». Il s’installa sur les terres de Shora, une contrée au nord-ouest du monde, et fit construire une forteresse faite avec des pierres sombres des volcans, solide et robuste, à l’épreuve du climat rude qui régnait sur cette région. Au début de son règne Valkar ne se montra pas avide de pouvoir, cachant ses desseins à son frère, Khadgar, resté près de lui pour le soutenir. Le Roi respectait les lois de son père ; ne pas intervenir. Et il se félicitait de ne pas l'avoir fait, après tout il avait juste accepté l'offre par ceux qui vivaient sur l’Éden qu’il avait conçu avec les paires, rien de plus. SLIDE 4 La nouvelle se répandit rapidement dans les contrées, les Dieux étaient parmi eux et Valkar se retrouva au centre de toutes les attentions. Adulé, prié plus que les autres, il gagna le cœur des peuples qui foulaient la terre de Dol Baran et se vit proposer de devenir le souverain de tous. L’idée n’était pas déplaisante aux yeux du Dieu de la mort. Le pouvoir sur les créations de son frère Ardar serait établi et personne ne pourrait plus le contester. Il n’en fallut pas plus pour qu’il accepte, devenant officiellement le Grand Roi de Dol Baran. Sa première action fut de diviser le monde en contrées. Bien qu’il fût un Dieu et qu’il lui aurait été aisé de gouverner un monde aussi vaste, il préféra donner le pouvoir à certaines grandes familles qu’il jugeait dignes de lui, espérant secrètement et pour lui-même qu’elles en fassent « mauvais usage ». Il s’installa sur les terres de Shora, une contrée au nord-ouest du monde, et fit construire une forteresse faite avec des pierres sombres des volcans, solide et robuste, à l’épreuve du climat rude qui régnait sur cette région. Au début de son règne Valkar ne se montra pas avide de pouvoir, cachant ses desseins à son frère, Khadgar, resté près de lui pour le soutenir. Le Roi respectait les lois de son père ; ne pas intervenir. Et il se félicitait de ne pas l'avoir fait, après tout il avait juste accepté l'offre par ceux qui vivaient sur l’Éden qu’il avait conçu avec les paires, rien de plus.
</div>
</li>
<li>
<div>
SLIDE 3
</div>
</li>
<li>
<div>
SLIDE 4
</div>
</li>
</ul>
</div>
</div>
Puis dans la feuille de style, repère ceci:
- Code:
a.control_prev, a.control_next {
position: absolute;
top:17%;
z-index: 999;
display: block;
padding: 4% 3%;
width: 16px;
height: 24px;
cursor: pointer;
}
a.control_prev {margin-left:-10px;}
a.control_next {right: 0;margin-right:-10px;}
Supprimes et remplaces par:
- Code:
a.control_prev, a.control_next {
position: absolute;
margin-top:200px;
z-index: 999;
display: block;
padding: 4% 3%;
width: 16px;
height: 24px;
cursor: pointer;
}
a.control_prev {margin-left:185px;}
a.control_next {margin-left:500px;}
Il y aura surement des ajustements a effectuer mais c'est fonctionnel .
a++
Invité- Invité
Re: Page d'Accueil avec une slide
C'est super, merci beaucoup
Ca rend super bien et la transition est bien mieux que celle que j'avais !
Je clôture le sujet, c'est génial ! ENCORE UN IMMENSE MERCIIIIIIIIIIIIIIIIII
Ca rend super bien et la transition est bien mieux que celle que j'avais !
Je clôture le sujet, c'est génial ! ENCORE UN IMMENSE MERCIIIIIIIIIIIIIIIIII
Re: Page d'Accueil avec une slide
Re,
de rien chère amie
a++
de rien chère amie
a++
Invité- Invité
Sujets similaires
» Affichage des visiteurs sur la page daccueil.
» Image avec un effet slide dessus
» Tentative de slide show avec affichage de miniatures
» page en désaccord avec son Css
» adapter page html sur une page classique (avec javascript)
» Image avec un effet slide dessus
» Tentative de slide show avec affichage de miniatures
» page en désaccord avec son Css
» adapter page html sur une page classique (avec javascript)
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum