Probleme pour faire fonctionner deux scroller sur la même pa

Petit nouveau ! | 3 Messages

13 févr. 2015, 22:32

Bonjour, je cherche à faire une page avec ces deux scroller, mais celui du haut n'apparait pas. Chez moi hors connexion les deux sont présents mais celui du bas ne tourne pas.
pourriez-vous m'aider à régler le problème.
Voici ce que j'obtiens http://www.pralognan-vanoise.com/test/s ... /index.htm
voila ce que je veux obtenir
Image

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta name="XAR Files" content="index_htm_files/xr_files.txt"/>
 <title>index</title>
 <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 <meta http-equiv="Content-Type" content="text/html; charset=Windows-1252"/>
 <meta name="Generator" content="Xara HTML filter v.5.0.1.979"/>
 <link rel="stylesheet" type="text/css" href="index_htm_files/xr_main.css"/>
 <link rel="stylesheet" type="text/css" href="index_htm_files/xr_text.css"/>
 <script type="text/javascript" src="index_htm_files/roe.js"></script>
     <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
    <title>Amazing Slider</title>
 
    <!-- Insert to your webpage before the </head> -->
    <script src="sliderengine/jquery.js"></script>
    <script src="sliderengine/amazingslider.js"></script>
    <link rel="stylesheet" type="text/css" href="sliderengine/amazingslider-1.css">
    <script src="sliderengine/initslider-1.js"></script>
    <!-- End of head section HTML codes -->
 	<meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
        <title>3D Gallery with CSS3 and jQuery</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
        <meta name="description" content="3D Gallery with CSS3 and jQuery" />
        <meta name="keywords" content="3d, gallery, jquery, css3, auto, slideshow, navigate, mouse scroll, perspective" />
        <meta name="author" content="Codrops" />
        <link rel="shortcut icon" href="../favicon.ico"> 
        <link rel="stylesheet" type="text/css" href="css/demo.css" />
        <link rel="stylesheet" type="text/css" href="css/style.css" />
		<script type="text/javascript" src="js/modernizr.custom.53451.js"></script>
</head>
<body>
<div class="xr_ap" id="xr_xr" style="width: 1200px; height: 1339px; top:0px; left:50%; margin-left: -600px;">
 <script type="text/javascript">var xr_xr=document.getElementById("xr_xr")</script>
<!--[if IE]><div class="xr_ap" id="xr_xri" style="width: 1200px; height: 1339px; clip: rect(0px 1200px 1339px 0px);"><![endif]-->
<!--[if !IE]>--><div class="xr_ap" id="xr_xri" style="width: 1200px; height: 1339px; clip: rect(0px, 1200px, 1339px, 0px);"><!--<![endif]-->
 <div style="position: absolute; left: 0px; top: 0px; width: 1200px; height: 460px;">
 
    <!-- Insert to your webpage where you want to display the slider -->
    <div id="amazingslider-wrapper-1" style="display:block;position:relative;max-width:1200px;margin:0px auto 56px;">
        <div id="amazingslider-1" style="display:block;position:relative;margin:0 auto;">
            <ul class="amazingslider-slides" style="display:none;">
                <li><img src="images2/3.jpg" />
                </li>
                <li><img src="images2/2.jpg" />
                </li>
                <li><img src="images2/1.jpg" />
                </li>
                <li><img src="images2/6.jpg" />
                </li>
                <li><img src="images2/7.jpg" />
                </li>
                <li><img src="images2/8.jpg" />
                </li>
            </ul>
            <ul class="amazingslider-thumbnails" style="display:none;">
                <li><img src="images2/3-tn.jpg" /></li>
                <li><img src="images2/2-tn.jpg" /></li>
                <li><img src="images2/1-tn.jpg" /></li>
                <li><img src="images2/6-tn.jpg" /></li>
                <li><img src="images2/7-tn.jpg" /></li>
                <li><img src="images2/8-tn.jpg" /></li>
            </ul>
        </div>
    </div>
    <!-- End of body section HTML codes -->
 </div>
 <div style="position: absolute; left: 153px; top: 832px; width: 804px; height: 383px;">
			<section id="dg-container" class="dg-container">
				<div class="dg-wrapper">
					<a href="http://www.pralognan-vanoise.com/forum/"><img src="images/1.jpg" alt="image01"><div>FORUM DE PRALOGNAN</div></a>
					<a href="https://www.facebook.com/pralognan"><img src="images/2.jpg" alt="image02"><div>FACEBOOK</div></a>
					<a href="https://plus.google.com/108007209033264831356/posts"><img src="images/3.jpg" alt="image03"><div>GOOGLE+</div></a>
					<a href="https://www.pinterest.com/pralo/"><img src="images/4.jpg" alt="image04"><div>PINTEREST</div></a>
					<a href="https://www.youtube.com/channel/UCgePYiUDsoGrFoCZ1McU0qg/featured?view_as=public"><img src="images/5.jpg" alt="image05"><div>YOUTUBE</div></a>
					<a href="https://huzzaz.com/collection/vos-vidos-sur-le-forum"><img src="images/6.jpg" alt="image06"><div>VOS VIDEOS DE PRALO</div></a>
					<a href="https://pralotalents.wordpress.com/author/pralotalents/"><img src="images/7.jpg" alt="image07"><div>LES TALENTS DE PRALOGNAN</div></a>
					<a href="https://sites.google.com/site/123gravir/"><img src="images/8.jpg" alt="image08"><div>123GRAVIR</div></a>
					<a href="http://www.panoramio.com/user/8269976"><img src="images/9.jpg" alt="image09"><div>PANORAMIO</div></a>
					<a href="https://www.facebook.com/bonhomme.de.neige.2015?ref=hl"><img src="images/10.jpg" alt="image10"><div>FACEBOOK "BONHOMMES DE NEIGE"</div></a>
					<a href="https://www.facebook.com/pages/Selfiepralo/748703911874686?ref=hl"><img src="images/11.jpg" alt="image11"><div>FACEBOOK "SELFIE PRALO"</div></a>
					<a href="http://www.pralognan-vanoise.com/imagelaurent/bibliotheque/bibliotheque.htm"><img src="images/12.jpg" alt="image12"><div>LA BIBLIOTHEQUE DU FORUM</div></a>
					<a href="https://twitter.com/Forum_Pralognan"><img src="images/13.jpg" alt="image12"><div>TWITTER</div></a>
				</div>
				<nav>	
					<span class="dg-prev"><</span>
					<span class="dg-next">></span>
				</nav>
			</section>
        </div>
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
		<script type="text/javascript" src="js/jquery.gallery.js"></script>
		<script type="text/javascript">
			$(function() {
				$('#dg-container').gallery();
			});
		</script/>
 </div>
 <div id="xr_xo0" class="xr_ap" style="left:0; top:0; width:1200px; height:100px; visibility:hidden;">
 <a href="" onclick="return(false);">
 </a>
 </div>
 <div id="xr_xd0"></div>
</div>
</div>
<!--[if lt IE 7]><script type="text/javascript" src="index_htm_files/png.js"></script><![endif]-->
<script type="text/javascript">xr_aeh()</script>
</body>
</html>
voici 2 liens avec les scrollers qui fonctionnent seuls
Quand je les réunis sur une seule page cela ne fonctionne plus

http://www.pralognan-vanoise.com/test/slider1
http://www.pralognan-vanoise.com/test/slider2/index.htm

Voici tous les fichiers

http://www.pralo.nevaone.eu/slider2.rar
http://www.pralo.nevaone.eu/slider1.rar

merci

Avatar du membre
Administrateur PHPfrance
Administrateur PHPfrance | 9782 Messages

13 févr. 2015, 23:46

Bonjour,

Tu intègres 2 fois la librairie Jquery dans 2 versions différentes ce qui peut provoquer des problèmes.
Quand tout le reste a échoué, lisez le mode d'emploi...

Petit nouveau ! | 3 Messages

14 févr. 2015, 00:00

que faut il modifier, je suis perdu !
merci.