Bonjour,
Voila afin que le joueur puisse choisir le nombre de message à afficher par page dans un forum, je désire utiliser un slider de la librairie jQuery. Le problème est que je n'arrive pas à afficher la valeur de mon slider dans le fameux span. Je tiens à préciser que afin de monter de le script et de m'assurer de son fonctionnement je l'ai testé en liant le Slider avec un input basique et que les résultats étaient concluants.
Voici mon code HTML :
Voila afin que le joueur puisse choisir le nombre de message à afficher par page dans un forum, je désire utiliser un slider de la librairie jQuery. Le problème est que je n'arrive pas à afficher la valeur de mon slider dans le fameux span. Je tiens à préciser que afin de monter de le script et de m'assurer de son fonctionnement je l'ai testé en liant le Slider avec un input basique et que les résultats étaient concluants.
Voici mon code HTML :
<?php
require('Systeme/data.php');
$autorisation = 1;
require('Systeme/chargement_membre.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<!-- titre de la page -->
<title>Mon village</title>
<!-- Meta Tags -->
<!-- Style de la page + Icones -->
<link type="text/css" rel="stylesheet" href="Systeme/CSS/style.css" />
<link rel="shortcut icon" type="image/x-icon" href="Images/icon.png" />
<link rel="icon" type="image/png" href="Images/icon.png" />
<!-- Javacript -->
<script type="text/javascript" src="Javascript/jquery.js"></script>
<script type="text/javascript" src="Javascript/Actions_compte.js"></script>
<!-- Api jQuery + Style -->
<link href="Systeme/CSS/slider.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</head>
<body>
<div class="titre"></div>
<?php
// On inclu le menu
include('Systeme/menu.php');
?>
<div class="page">
<div class="conteneur">
<h1>Votre compte</h1>
<!-- Le slider -->
<div id="slider" style="margin : 10px;"></div>
<!-- Le span d'affichage -->
<span id="forum" style="display : block;"></span>
<!-- Input dont la valeur sera récupéré dans la base de données -->
<input type="hidden" value="20" id="value_default" />
</div>
</div>
<!-- Si javascript n'est pas activé chez le visiteur -->
<noscript>
<div class="cache" style="display : block;"></div>
<div class="fenetre" style="display : block;">
<h1 id="titre">Javascript est désactivé</h1>
<div id="message">
<div class="message_information">Le site internet demande l'activation de javascript pour pouvoir fonctionner. Pour le réactiver référez vous au manuel d'utilisation de votre navigateur via la touche "F1" et en recherchant "Activer Javascript".</div>
</div>
</div>
</noscript>
</body>
</html>
$(document).ready(function() {
var value_default = $('#value_default').val();
$("#slider").slider();
$("#slider").slider({ animate: true });
$("#slider").slider({ max: 50 });
$("#slider").slider({ min: 10 });
$("#slider").slider({ step: 10 });
$("#slider").slider({ value: value_default });
$("#forum").text(value_default + ' messages par page');
$("#slider").slider({
change: function(event, ui) {
var value = $("#slider").slider( "option", "value" );
$("#forum").text(value + ' messages par page');
}
});
});
