Vous n'êtes pas identifié(e).
- Contributions : Récentes | Sans réponse
Pages : 1
#1 Re : Javascript » lien javascript vers une div sur la meme page » 08-02-2014 15:37:28
Pour le code, j'aurai essayé 
Merci pour l'explication du script, je pense l'avoir comprise
donc le script : $("#choix1").click(function(e){
e.preventDefault();
$('#centre').empty().append($.ajax({
url: 'choixmenu1.php',
async: true
}).responseText);
return false;
});
On l'appelle sur la page (menu.php) ou il y a le menu
On lui dit d'aller sur la div "centre" par $('#centre') ,cette div "centre" n'est pas dans la page menu.php mais dans la page centre.php
les pages menu.php et centre.php sont "incluses" dans la page index.php via <?php include ("menu.php") ?> et <?php include ("centre.php") ?>
le script que tu as expliqué ne doit pas s'appeler dans la page centre.php ni index.php ?
#2 Re : Javascript » lien javascript vers une div sur la meme page » 08-02-2014 15:37:28
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>menu</title>
<link rel="stylesheet" href="css/feuille.css" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
nSpace=4 // how many space maximum between each letter
nSpeed=100 // the speed of the animation
timerRADM=null;
function LetterSpacingMenu() {
if(document.getElementById){
lnks = Math.floor(Math.random()*lnk.length);
letterSpacing = Math.floor(Math.random()*nSpace);
lnk[lnks].style.letterSpacing = letterSpacing + "px";
timerRADM = setTimeout("LetterSpacingMenu()", nSpeed);
}
}
function StopMenu() {
if(document.getElementById) {
clearTimeout(timerRADM);
for(i=0;i<lnk.length;i++){
lnk[i].style.letterSpacing = 0 + "px";
}
}
}
function RADMenuInit() {
if(document.getElementById) {
lnk = document.getElementById("menugauche").getElementsByTagName("a");
cnt = document.getElementById("menugauche");
cnt.style.textAlign= "center";
cnt.onmouseover=StopMenu;
cnt.onmouseout=LetterSpacingMenu;
LetterSpacingMenu();
}
}
</script>
</head>
<body onload="RADMenuInit();">
<div id="menugauche">
<table id="table_menugauche">
<tr>
<td class="cellule" >
</td>
</tr>
<tr>
<td class="cellule">
<a id="choix1" href="#">Choix 1</a>
</td>
</tr>
<tr>
<td class="cellule">
<a id="choix3" href="#">Choix 2</a>
</td>
</tr>
<tr>
<td class="cellule">
<a href="#" id="a3" class="menulinks" title="naturopathie">Naturopathie</a>
</td>
</tr>
<tr>
<td class="cellule">
<a href="#" id="a4" class="menulinks" title="luminotherapie">Luminotherapie</a>
</td>
</tr>
<tr>
<td class="cellule"></td>
</tr>
</table>
</div>
<script type="text/javascript">
$(document).ready(function() {
$("#choix1").click(function(e){
e.preventDefault();
$('#centre').empty().append($.ajax({
url: 'choixmenu1.php',
async: true
}).responseText);
return false;
});
$("#choix2").click(function(e){
e.preventDefault();
$('#centre').empty().append($.ajax({
url: 'choixmenu2.php',
async: true
}).responseText);
return false;
});
});
</script>
</body>
</html>
j'ai créée 2 pages choix choixmenu1.php et choixmenu2.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
</head>
<body>
<?php echo " l'utilisateur a choisi le 'menu 1'" >
</body>
</html>
il n'affiche pas "l'utilisateur a choisi...." et en bas il affiche "erreur sur la page"
je ne vois pas ou est l'erreur
désolé de mon noobisme 
#3 Re : Javascript » lien javascript vers une div sur la meme page » 08-02-2014 15:37:28
page index.php
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>index</title>
<link rel="stylesheet" href="css/feuille.css" type="text/css" />
</head>
<body>
<div id="principale">
<?php include ("header.php") ?>
<?php include ("top_menu.php") ?>
<?php include ("menu.php") ?>
<?php include ("centre.php") ?>
<?php include ("footer.php") ?>
</div>
</body>
</html>
Menu.php
<script type="text/javascript">
$(document).ready(function() {
$("#choix1").click(function(e){
e.preventDefault();
$('#principale').empty().append($.ajax({
url: 'choixmenu1.php',
async: true
}).responseText);
return false;
});
$("#choix2").click(function(e){
e.preventDefault();
$('#principale').empty().append($.ajax({
url: 'choixmenu2.php',
async: true
}).responseText);
return false;
});
});
</script>
<script type="text/javascript">
nSpace=4 // how many space maximum between each letter
nSpeed=100 // the speed of the animation
timerRADM=null;
function LetterSpacingMenu() {
if(document.getElementById){
lnks = Math.floor(Math.random()*lnk.length);
letterSpacing = Math.floor(Math.random()*nSpace);
lnk[lnks].style.letterSpacing = letterSpacing + "px";
timerRADM = setTimeout("LetterSpacingMenu()", nSpeed);
}
}
function StopMenu() {
if(document.getElementById) {
clearTimeout(timerRADM);
for(i=0;i<lnk.length;i++){
lnk[i].style.letterSpacing = 0 + "px";
}
}
}
function RADMenuInit() {
if(document.getElementById) {
lnk = document.getElementById("menugauche").getElementsByTagName("a");
cnt = document.getElementById("menugauche");
cnt.style.textAlign= "center";
cnt.onmouseover=StopMenu;
cnt.onmouseout=LetterSpacingMenu;
LetterSpacingMenu();
}
}
</script>
</head>
<body onload="RADMenuInit();">
<div id="menugauche">
<table id="table_menugauche">
<tr>
<td class="cellule" >
</td>
</tr>
<tr>
<td class="cellule">
<a href="#" id="a1" class="menulinks" title="lien1">lien 1</a>
</td>
</tr>
<tr>
<td class="cellule">
<a href="#" id="a2" class="menulinks" title="lien2">lien 2</a>
</td>
</tr>
<tr>
<td class="cellule">
<a href="#" id="a3" class="menulinks" title="lien3">lien 3</a>
</td>
</tr>
<tr>
<td class="cellule">
<a href="#" id="a4" class="menulinks" title="lien4">lien 4</a>
</td>
</tr>
<tr>
<td class="cellule"></td>
</tr>
</table>
</div>
</body>
</html>
Lien1.php
AMMA ASSIS
L'Anmma (ou amma) est une technique de massage japonais d'origine chinoise. Anmma qui signifie calmer avec les mains a été inventée en Chine sous le nom original Anmo, et adoptée par les japonais il y a plus de mille ans.
centre.php
<div id="centre">
</div>
#4 Re : Javascript » lien javascript vers une div sur la meme page » 08-02-2014 15:37:28
quand je fais ca, ca me met ....localhost/site/# et ca n'affiche pas la page du lien dans la div principale
#5 Re : Javascript » lien javascript vers une div sur la meme page » 08-02-2014 15:37:28
salut, je n'arrive pas à faire aller le code mais c'est peut etre à cause de la structure de mon code
____________________________________
| |
| |
| div top menu accueil contact |
|___________________________________ |
| | |
| div | | =====> ca c'est ma page index.php
| menugau | |
| | |
| lien1 | DIV principale |
| lien2 | |
| | |
| | |
| | |
| | |
| | |
| | |
____________________________________
dans cette page index.php, j'ai fait des includes : top_menu.php
menu.php (menu gauche)
centre.php (div principale)
footer.php
dans menu.php j'ai fait comme ca: dans un tableau
<a href="#" id="a1" class="menulinks" title="lien1">lien 1</a>
<a href="#" id="a2" class="menulinks" title="lien2">lien 2</a>
<a href="#" id="a3" class="menulinks" title="lien3">lien 3</a>
<a href="#" id="a4" class="menulinks" title="lien4">lien 4</a>
dans centre.php ,je n'ai qu'une div
<div id="principale">
</div>
donc le code javascript se met dans la page menu.php ? dans le body ou dans le head ?
et le code php, la je n'ai pas compris il se met dans centre.php ?
donc quand je clique sur "lien 1" je voudrais que la page lien_1.php se mette dans la div principale qui se trouve sur la page centre.php
ou alors s'il y a une solution plus simple, je suis preneur
met en tout cas pour ton aide 
#6 Re : Javascript » lien javascript vers une div sur la meme page » 08-02-2014 15:37:28
merci c cool , un seul lien suffira ,je ferai le reste pour comprendre la demarche
#7 Re : Javascript » lien javascript vers une div sur la meme page » 08-02-2014 15:37:28
pierrot, si tu peux me mettre en exemple ce que tu dis ca serait pas mal oué
maljuna si le javascript est désactivé, j'ai deja mis un code sur le menugauche (ca aggrandit reduit la police d'ecriture) que j'ai adapté pour mon menugauche; donc en local chez moi ca marche maintenant tu parles de ceux qui vont aller sur le site que je vais mettre en ligne
#8 Javascript » lien javascript vers une div sur la meme page » 08-02-2014 15:37:28
- atino
- Réponses : 23
bonjour,
je voudrais creer des liens d'un menu vers une div sur la meme page sans recharger la page complete
je m'explique :
j'ai une div principale qui fait la page index.php ,j'ai plusieurs div (div topmenu, div menugauche et div centrale), dans la div top menu j'ai une page topmenu.php dans la div menugauche j'ai la page menugauche.php
dans la topmenu ,j'ai un menu dans une table , ---> accueil et contact, je voudrais quand je clique sur contact que la page index.php reste comme elle mais que la div principale soit changer avec les infos du lien contact
____________________________________
| |
| |
| div top menu accueil contact |
|___________________________________ |
| | |
| div | |
| menugau | |
| | |
| lien1 | DIV principale |
| lien2 | |
| | |
| | |
| | |
| | |
| | |
| | |
____________________________________
donc pour resumer quand je clique sur lien1 (par exemple) la page lien.php vienne se mettre la div principale
pouvez vous me faire le script pour le lien1 ,j'essaierai de le comprendre de le modifier pour le faire les autres liens
merci d'avance pour votre aide
Pages : 1