Scroll du corps de son site

Résolu/Fermé
yaorens Messages postés 205 Date d'inscription dimanche 5 avril 2009 Statut Membre Dernière intervention 30 mai 2013 - 14 sept. 2010 à 14:16
jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 - 28 sept. 2010 à 21:02
Bonjour,

je suis en train de realiser un site web et je voudrais y ajouter des textes dans le corps de mon site , mais je voudrais que si les textes sont long , qu'il l'y ait une barre qui permet de defiler , un peu comme lorsque tu ecris beaucoup de texte dans une formulaire de type textarea.
c'est a dire que le corps de bouge pas mais il y'a une barre a l'interieur du corps qui permet de defiler.
merci j'espere que je me fais bien comprendre ,
Nb : j'utilise le langage php pour mon site

j'ajoute le code de ma page index pour que vous puissiez m'aider. merci de me venir en aide





<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>Titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="corpsindex" href="corpsindex.css"/>

<style type="text/css">
body
{
background-color: rgb(159,255,159);
}



#corps
{
margin-left: 170px;
margin-bottom: 20px;
padding: 5px;


color: red;/*couleur du texte*/
background-color: rgb(223,223,223); /* couleur du vide a cote du texte*/
background-repeat: repeat-x;

border: 2px solid black;
}

#corps h1
{
color: #B3B3B3;
text-align: center;
font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
moz-user-select:none;
}

.corps h2
{
height: 30px;
moz-user-select:none;
background-image: url("images/titre.png");
background-repeat: no-repeat;

padding-left: 30px;
color: #B3B3B3;
text-align: left;
}

</style>

<body>

<?php include("en_tete.php");?>

<?php include("menu.php");?>

<div id="corps">

<p>ehefjejfbgedvjedbfjejbdfvjbedvbjebdjfvberdfjrbdejfgrbjgbjrbgjfvbrjbjebjfbdvjfbrjdbfj

<?php
$monfichier = fopen('compteur.txt', 'r+');

$pages_vues = fgets($monfichier); // On lit la première ligne (nombre de pages vues)
$pages_vues++; // On augmente de 1 ce nombre de pages vues
fseek($monfichier, 0); // On remet le curseur au début du fichier
fputs($monfichier, $pages_vues); // On écrit le nouveau nombre de pages vues

fclose($monfichier);

echo '<p>Cette page a été vue ' . $pages_vues . ' fois !</p>';
?>

</form>

</div>




<?php include("pied_de_page.php");?>

</body>
</html>


A voir également:

8 réponses

jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 181
14 sept. 2010 à 14:43
Bonjour,

Je pense qu il faut que tu ajoute :

overflow: auto;

dans #corps

0
leCondore Messages postés 3 Date d'inscription mardi 14 septembre 2010 Statut Membre Dernière intervention 14 septembre 2010
14 sept. 2010 à 14:52
merci pour ta reponse , mais je voudrais savoir en mettant cette propriete , je n'ai pas a definir la hauteur du corps a laquelle une barre de defilement doit apparaitre ?
je suis encore debutant dans ce langage et je suis un peu submerge par toutes cette quantite de codes a retenir , du coup , je me melange un peu les pedales et ais du mal a assimiler certaines choses.
merci de me repondre
0
leCondore Messages postés 3 Date d'inscription mardi 14 septembre 2010 Statut Membre Dernière intervention 14 septembre 2010
14 sept. 2010 à 14:54
aussi tout a l'heure j'ai ajoute le overflow:auto; comme tu me l'as dit dans le #coprs mais cela n'a eu aucun effet , le resultat que je voulais n'y etais pas
0
leCondore Messages postés 3 Date d'inscription mardi 14 septembre 2010 Statut Membre Dernière intervention 14 septembre 2010
14 sept. 2010 à 14:58
au fait , je reprends mes explications , tu vois quand tu ecris un long texte dans le code suivant :

p>
<textarea name="precisions" id="precisions" cols="40" rows="4" tabindex="80"> <?php echo" salut";?></textarea>
</p>


lorsque le texte est long , il y'a un bouton a gauche qui te permet de pourvoir soit faire dessendre ou faire monder .
je veux que le corps de mon site ne bouge pas , qu'il soit fixe mais par contre que lorsque le texte a l'interieur est long , qu'il l'y est le bouton de defilement ( pas pour le corps du site mais pour le tableau dans lequel se trouve les informations contenues dans le corps du site >
0
jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 181
Modifié par jjsteing le 14/09/2010 à 15:12
Un peu comme sur mon site perso ( http://www.pitch-jjs.com/Photos/index.php?id=0&RepEnCours=Photos/2010/10-04-30%20-%20Sky%20diving%20Dubai ) .... si il y a pas trop de photos, il affiche pas la barre de défilement, et si il y en a plein, là, il l affiche ;) ... (ps, met les miniatures en grands, en cliquant en haut à droite sur les carrés rouges ;) )

C est ca ??? Si oui, voici (en partie) mon stylecss.php :

<?php
header('Content-type: text/css');
$DebordHaut=00; // mettre à 200 ou 300 pour voir les erreur du site (sql, fnc erreur, echo, ...)
$ScreenW=$_COOKIE["InnerWidth"]; //récupéré en js
$ScreenH=$_COOKIE["InnerHeight"] - $DebordHaut; //récupéré en js

$LargeurMenu=130;
$LageurMenuBas=20;
$LargeurEntete=75;
$LongueurEntete=500;
$LageurBordure=0;
?>

.CorpPage {
position: Absolute;
border: 0px;
margin: 0px;
padding: 0px;
left: <?php echo $LargeurMenu + $LageurBordure ?>px;
top: <?php echo $LargeurEntete + $LageurBordure + $DebordHaut ?>px;
height: <?php echo $ScreenH - $LargeurEntete - $LageurBordure - $LageurMenuBas ?>px;
width: <?php echo $ScreenW - $LargeurMenu - $LageurBordure ?>px;
overflow: auto;
}
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 181
14 sept. 2010 à 14:59
Re,

Si, il faut définir la hauteur (height) et la largeur (width) du corp de la page...


Je peux te donner un exemple 'vierge' si tu veux...
0
yaorens Messages postés 205 Date d'inscription dimanche 5 avril 2009 Statut Membre Dernière intervention 30 mai 2013 7
15 sept. 2010 à 19:55
Salut ,

Merci beaucoup jjsteing , c'est exactement le resultat que je recherchais , maintenant ( suis un peu bricolo) , dis moi que dois je faire si je veux qu' il y'ait un block ( comme le corps du site) qui est inclus dans le corps du site dans lequel je pourrai ecrire du texte.

Par ailleurs , dis j'ai visite ton site et il est sympa cool , dis moi comment faire tu pour le mettre en deux versions , francais et anglais ( aussi comment tu as fait pour obtenir ces deux drapeaux, suis nul en dans ce domaine ).

j'aimerais tout comme toi faire mon site en plusieurs langues , (francais et anglais) stp pourrais tu me dire comment proceder avec des codes a l'appui si possible.

merci d'aider un novice a mieux comprendre le fonctionnement du web.
Nb: mon site web comprendra beaucoup de texte a traduire.
mais bon si je peux deja traduire un bout de phrase ce sera pas mal , je pourrai me debrouiller pour traduire tout mon site.
0
jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 181
Modifié par jjsteing le 19/09/2010 à 08:50
Salut :)

Bon, tout d abord, pour mettre ton site en plusieurs langues, tu as 3 possibilités:)

1 - créer plusieurs pages php en fonction de la langue (pas tres pratique, surtout si tu dois changer des choses dedans (affichage, ajout de fonctions, ect) => acceuil_fr.php et Acceuil_En.php (perso, j aime pas trop, mais ca fonctionne, et faut etre tres tres tres carré !)

2 & 3 Créer ta page (acceuil.php par ex) et faire référence au texte via une function
=>
2 le texte se trouve dans un fichier texte sur ton site
3 le texte se trouve dans ta bd (sql)


J'ai choisi l option 2 (texte à traduire dans un fichier texte sur le serveur)

exemple :
Acceuil.php
<?php   
$Html="<from><head></head><body>";   
$Html.=Translate("Acceuil")."<br>".Translate("TxtAcceuil");   
$Html.="</body></form>";  
echo $Html;   
?>   


Fnc.php:
 global $TranslateFR;   
 global $TranslateEN;   

 $Info=lire_fichier("Translate.txt");   
 $nb=count($Info);   
    
 $i=0;   
 for ($i=0;$i<$nb;$i++) {   
  $Ligne=explode('|',$Info[$i]);   
  $TranslateFR[$Ligne[0]]=$Ligne[1];   
  $TranslateEN[$Ligne[0]]=$Ligne[2];   
 }   

}   

function lire_fichier($file_name) {   
 //si le fichier exist l'ouvrir   
 if ( file_exists("$file_name") ) {   
  $handle=fopen("$file_name",'r');   
  }   
 //sinon FALSE   
 else {   
  return FALSE;   
  }   
    
 //lecture du fichier   
 $read=fread($handle,filesize ("$file_name"));   
    
 //d?upage par ligne   
 $ligne=explode("\n", $read);   
 $nb_lignes=count($ligne);   
 $data=array();   
 for ($i=1;$i<$nb_lignes-1;$i++) {   
  $data[$i-1]=$ligne[$i];   
  }   
 fclose($handle);   
//chaque ligne dans $data[]   
return($data);   
}   

function Translate($Cat){   
 global $TranslateFR;   
 global $TranslateEN;   
//Va chercher dans le cookie si une langue est choisie, sinon, met en anglais   
 if ($_COOKIE["LangueSite"] == "Fr"){   
  return $TranslateFR[$Cat];   
 }else{   
  return $TranslateEN[$Cat];   
 }   
    
}   



Translate.txt:
<?   
Acceuil|Acceuil|Home|   
TxtAcceuil|Bienvenue sur mon site |Welcome on my website|   
Connection|Se connecter|Sign in|   
?>   



le fichier est composer comme suit :

a|b|c|
a=nom générale à traduire
b=texte en français
c=texte en anglais

oubli pas le dernier | !!!!!!

de cette facon, tu peux mettre autant de langue que tu veux !! juste séparée par un |, bien sur il faudra modifier un peu Fnc.php

bon, donc voici en gros comment ca tourne chez moi (j ais fait un copier collé, alors, y a ptetre 1 ou 2 modif à faire pour que le code marche tel qu il est là.. )

Pour la solution 3, c est pareil sauf que tu met ton texte dans une base de donnée, et tu vas chercher dans la bd le texte à traduire.

En ce qui concerne le drapeau, ben je sais plus , mais j pense que je l ai chopé sur google image, j ais juste ajouté de la transparence ;).
Tu peux le réprendre, ca me gène pas.
Lorsque que l utilisateur clique dessus, il va ecrire dans un cookie 'Fr' ou 'En'.. et je recharge la page pour affiché le bon langage...

Pour lhistoire du block qui s'étend en fonction du contenu.. c est un peu plus compliqué car je passe par du css, php et js afin de connaitre la dimension de la fenetre, et de là, connaissant la taille, j'affiche mon site.... mais si tu veux le principe, c est simple :

|--------------------------------------------------------|   
|               |                                                      |   
|               |     Menu Entete                             |   
|               |                                                      |   
|               |-------------------------------------------|   
| Menu     |                                                       |   
|               |                                                      |   
|Gauche   |                                                      |   
|               |                                                      |   
|               |    Corp de page                             |   
|               |                                                      |   
|               |                                                      |   
|               |                                                      |   
|--------------------------------------------------------|   

<div class="Entete">"Menu entete"</div>   
<div class="MenuG">"Menu gauche"</div>   
<div class="CorpPage">"Corp de page"</div>   


1)
en javascript, je récupère la dimention de la fenetre:

 expdate.setTime(expdate.getTime() + (24 * 60 * 60 * 1000 * 2));// 1 jour   

 NomNavigateur=navigator.appName;   
 VersionNavigateur=parseInt(navigator.appVersion);   
 //pour IE   
 if(NomNavigateur == 'Microsoft Internet Explorer' && VersionNavigateur >= 4){   
  if(document.body.clientWidth != GetCookie("InnerWidth") || document.body.clientHeight > (GetCookie("InnerHeight")*11/10) || document.body.clientHeight < (GetCookie("InnerHeight")*9/10)){   
    document.cookie = "InnerHeight=" + document.body.clientHeight + "; expires=" + expdate.toGMTString();   
    document.cookie = "InnerWidth=" + document.body.clientWidth + "; expires=" + expdate.toGMTString();   
    document.cookie = "Navigateur=IE; expires=" + expdate.toGMTString();   
    Recharge=true;   
  }   
 //Pour Firefox   
 }else{   
  if(window.innerWidth != GetCookie("InnerWidth") || window.innerHeight > (GetCookie("InnerHeight")*11/10) || window.innerHeight < (GetCookie("InnerHeight")*9/10)){   
    
    document.cookie = "InnerHeight=" + window.innerHeight + "; expires=" + expdate.toGMTString();   
    document.cookie = "InnerWidth=" + window.innerWidth + "; expires=" + expdate.toGMTString();   
    document.cookie = "Navigateur=Other; expires=" + expdate.toGMTString();   
    Recharge=true;   
  }   
 }   


si Recharge=true, je recharge la fenetre

2)
et dans le css (et c 'est la ou ca se complique car j inclus du php dedans !!

<?php 
$MenuLargeur =100;   
$ScreenW=$_COOKIE["InnerWidth"];   
$ScreenH=$_COOKIE["InnerHeight"];   
?> 

.entete{   
position: Absolute;   
margin: 0px;   
border: 0px;   
padding:0px;   
top: 0px;   
left:0px;   
margin-left: 0px;   
width:  <?php echo $ScreenW - $MenuLargeur ?>px;   
height: <?php echo $MenuLargeur ?>px;   
}   

.MenuG{   
position: Absolute;   
border: 0px;   
margin: 0px;   
padding: 0px;   
top: 0px;   
left: 0px;   
height: <?php echo $ScreenH ?>px;   
width:  <?php echo $MenuLargeur ?>px;   
overflow: auto;   
}   

.CorpPage {   
position: Absolute;   
border: 0px;   
margin: 0px;   
padding: 0px;   
left: <?php echo $MenuLargeur ?>px;   
top: 0px;   
height: <?php echo $ScreenH -($MenuLargeur) - 10 ?>px;   
width:  <?php echo $ScreenW -$MenuLargeur ?>px;   
overflow: auto;   
}   

<?php 
//tres important ces derniere balises !!! 
?> 


3)
dans mon acceuil.php au (presque) tout début j ais :

//si je connais la dimention de la fenetre : 
 if (isset($_COOKIE["InnerWidth"])){ 
  $Html.="<link rel='stylesheet' type='text/css' href='StyleCss.php?v=".time()."'>"; 
 }else{ 
  //Initialise les cookies nécessaire pour l affichage du site 
  $Html.="<script>SetCookie('IP','".$_SERVER['REMOTE_ADDR']."');</script>"; 
 } 



Dans le set cookie du javascript, je vérifi si je connais innerHeight, au quel cas, je le cré.. cf le 1).. et la boucle est bouclée !!


Bon, pareil, c est du copier collé, faut arrangé à ta sauce ;)
T as déjà une bonne tartine là..

Mais si t as un soucis ou des questions , hésite pas...


Bon courage :)

@++
N'hésitez pas à poser des questions, il vaut mieux être con 5 min que le rester toute sa vie ;)
N'oubliez pas de mettre votre Post en 'Résolu' quand c'est le cas :-D
0
jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 181
19 sept. 2010 à 09:08
Sinon, sur mon site d aide en ligne (jjsteing.com dans la section téléchargement, tu à un zip avec tous mes fichiers d un site 'vierge'.. mais tu risque d etre un peu perdu....vu qu il y a toutes les fonctions, le style, et touticointi... mais bon, ca peut te donner une piste aussi ;)
0
yaorens Messages postés 205 Date d'inscription dimanche 5 avril 2009 Statut Membre Dernière intervention 30 mai 2013 7
20 sept. 2010 à 15:56
Merci vraiment pour tous tes conseils , je vais essayer de m'appliquer sur les codes que tu m'a propose , stp , encore une derniere question je dispose d'une image qui se trouve sur mon pc ( chemin : c:images/nouveau dossier/image.jpeg) , comment est ce que je dois faire pour ajouter cette image sur le site car la balise <img> ne me permet pas d'ajouter une nouvelle photo sur mon site a part bien sur que je souhaite que la photo soit en fonf , la j'utilise la fonction (CSS : background-image) .

si je veux ajouter une photo dis moi comment faire stp. merci beaucoup pour tout ce que tu as deja fait pour moi.
0
jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 181
Modifié par jjsteing le 21/09/2010 à 13:05
Re,

Pour ta photo, si ton site est héberger sur un serveur, il faut tout d abord l'uploader. Créer un répertoire Images à la racine et met la dedans.
Si tu t héberge tout seul, tu doit savoir où se situe le répertoire de ton site (ex: c:\program files\easy php\www\ ).. Pareil, créé un répertoire Images et copie cette image dedans..


Attention, les minuscules/majuscules peuvent être importante !!
Après, c est du billard..:

<img src="Images/image.jpeg">

@++
0
jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 181
28 sept. 2010 à 21:02
Post résolu ?
0
yaorens Messages postés 205 Date d'inscription dimanche 5 avril 2009 Statut Membre Dernière intervention 30 mai 2013 7
21 sept. 2010 à 18:53
Merci enormement jjsteing

Je te remercie enormement pour tous tes conseils , je souhaiterait stp , si tu pourrais me laisser ton contact car j'aimerais garder le contact avec toi pour que dans l'avenir ( je ne le souhaite pas si j'ai un petit souci que tu puisses me conseiller).
je sais que c'est trop te demander vu tout ce que tu as deja fait mais , j'aimerais vraiment garder le contact avec toi et devenir comme toi aussi un as du Php/Javascript car tes aides sont plus objectives et au moins cela me permet de vite comprendre et d'avancer.

merci
0
jjsteing Messages postés 1669 Date d'inscription vendredi 11 mai 2007 Statut Contributeur Dernière intervention 21 mai 2012 181
22 sept. 2010 à 13:18
Oh la la.. j suis loin d etre un as du php..mais je me débrouille, je cherche, je bidouille et surtout... je persévère !! :)

comme le dis ma devise : posez des questions, il vaut mieux être con 5 min que le rester toute sa vie ;)
0