28220 sujets

CSS et mise en forme, CSS3

Pages :
Bonjour, je suis debutant en css j'ai donc grace a vos tuto reussi a faire une mise en pages contenant des bloc. dans chacun de ces bloc il y a des images dans lekel des liens se trouvent. J'aimerai si c possible pouvoir faire en sorte que lorsque l'on click sur l'image ca ouvre le lien dans un bloc ou sur un bloc precis a la maniere d'une iframe. merci Smiley langue
ps : voici mon css
a écrit :
/* CSS Document */
body {
margin: 0;/* sans marges, la page sera colle aux bords */
font-family: verdana, arial, sans-serif; /* on dfinit la police de base dans la page */
font-size: 12px; /* on dfinit la taille de police de base dans la page */
}

.head1 {
background-image: url('../image/header1.jpg');
width: 935px;
height: 163px;
}

.logo {
float: left;
margin-right: 10px;
margin-top: 3px;
border: 0;
}

.menu {
position: absolute;
left:0;
background-image: url('../image/menu.jpg');
width: 201px;
height: 522px;
}

.menu2 {
position: absolute;
left:201;
background-image: url('../image/menu2.jpg');
width: 584px;
height: 82px;
}

.centre {
position: absolute;
left:201;
background-image: url('../image/centre.jpg');
width: 584px;
height: 440px;
top: 245;
}

.droite {
position: absolute;
left:785;
background-image: url('../image/droite.jpg');
width: 150px;
height: 522px;
}

.bas {
position: absolute;
left:0;
top:685;
background-image: url('../image/bas.jpg');
width: 935px;
height: 52px;
}
Je ne veux pas dire de betises, mais cela doit se regler avec du php ou de asp ou quelque chose comme ça.
alibaba a écrit :
Je ne veux pas dire de betises, mais cela doit se regler avec du php ou de asp ou quelque chose comme ça.


Aïe.

Avant de sortir l'arme nucléaire tactique pour tenter de pilonner un moustique, réfléchissons un peu à la logique de la chose Smiley cligne

wacha a écrit :
Bonjour, je suis debutant en css j'ai donc grace a vos tuto reussi a faire une mise en pages contenant des bloc. dans chacun de ces bloc il y a des images dans lekel des liens se trouvent. J'aimerai si c possible pouvoir faire en sorte que lorsque l'on click sur l'image ca ouvre le lien dans un bloc ou sur un bloc precis a la maniere d'une iframe.


Si j'ai bien suivi, et d'après la CSS ci-dessus :
- on a une série d'images apparement générées en CSS (background-image) ?
- en arrière-plan de zones supposées cliquables, donc de liens <a> ?
- qui doivent "ouvre le lien dans un bloc ou sur un bloc precis a la maniere d'une iframe." Des <div> ?

Ce n'est pas possible, pour d'excellentes raisons, et tous les PHP ASP du monde n'y changeront rien :
- les images en question sont de simples déco, inactives et non réactives (CSS = déco)
- le comportement des liens en question est déterminé par leur éventuel attribut target, dans le seul cadre des <frame>
- Un lien ne peut pas viser de cette manière un "bloc" de type <div>

Les excellentes raisons sont que:
- CSS ne s'occupe que de mettre une couche de peinture pour faire joli et n'est pas du tout fait pour s'occuper de ce que font les liens
- pour réaliser ce genre de chose, il y a un truc super, un joujou extra, comme dirait l'autre : les frames. Et ça ne se passe qu'en HTML, pas en CSS
Pourquoi ce ne serait pas possible en PHP??

Par exemple disons que chaque bloc est bien identifie par un id (1,2,3 ...). Si on veut qu'un clic quelque part mette un contenu dans le bloc d'id n, il suffit se passer n a php qui en retour remplit le bloc n avec le contenu approprie.

Sylvain
Et renvoie du même coup l'ensemble du document, pas seulement le "bloc d'id" concerné. Bref, c'est un lien lambda. Smiley lol

Bon, là, immanquablement, quelqu'un d'intelligent va débarquer avec XMLHttpRequest Smiley cligne

Qui s'y colle ?
Modifié le 29 Jan 2005 - 15:22
Oui, je suis d'accord, tout le document sera renvoye.
Je tenais cependant a preciser, au cas ou le createur du sujet aurait pense que c'etait impossible a realiser.

S.
lut la foule Smiley cligne

Si j'ai bien compris le problème j'aurais tendance à ne pas être d'accord avec toi laurent.

A partir du moment ou une balise <a> est présente il est tout à fait possible d'ouvrir ce lien ds n'importe quel div avec du php

en utilisant un include et un if ou un switch case.


EDIT:
je viens de lire les réponses.

avec ce que je cite il n'y auras que la page demandé qui sera rechargée ds le bloc cible.

http://thesheet.free.fr

je n'utilise pas d'iframe ni de frame
Modifié le 29 Jan 2005 - 16:06
Je pense que ce que Laurent Denis voulait souligner c'etait qu'une solution basee sur PHP recharge toute la page, a la difference d'une iframe ou on peut ne rafraichir QUE son contenu et laisser le reste de la page inchange.

Sylvain
knarf a écrit :
lavec ce que je cite il n'y auras que la page demandé qui sera rechargée ds le bloc cible.

http://thesheet.free.fr

je n'utilise pas d'iframe ni de frame


J'ai un peu de mal à consulter l'exemple :

a écrit :
Warning: main(default.php): failed to open stream: No such file or directory in /var/www/free.fr/e/c/thesheet/index.php on line 39

Warning: main(): Failed opening 'default.php' for inclusion (include_path='/var/www/free.fr/e/c/thesheet/include:.') in /var/www/free.fr/e/c/thesheet/index.php on line 39
Laurent Denis, Commandant en chef des armées a écrit :

Avant de sortir l'arme nucléaire tactique pour tenter de pilonner un moustique, réfléchissons un peu à la logique de la chose Smiley cligne


Aïeeuuh.

Laurent Denis a écrit :

Bon, là, immanquablement, quelqu'un d'intelligent va débarquer avec XMLHttpRequest Smiley cligne

Je sais pas si tu ironises, mais en tout cas, ça me paraît plutôt lourd d'implémentation, un rechargement de page devrait être plus efficace il me semble.
merci pour les reponse alors je v vous eclaircir un peu voici le code de la page
a écrit :
<html>
<head>
<title>Fiesta</title>
<link href="css/index.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="head1">
<img src="image/logo.jpg" alt="logo" width="321" height="107" class="logo" /></div>
<div class="menu">

</div>
<div class="menu2"></div>
<div class="centre"></div>

<div class="droite"></div>
<div class="bas"></div>
</body>

</html>

rien de tres complique.
voila ci join l'image donc vous voyez le menu sur la gauche.
sinon autre solution que le php ca ne serai pa plus facile de faire un sorte que les lien soit des image mise en place grace a du html comme ca plus de pb pour les liens mais est ce que ca serai possible de rediriger ca au milieu sans iframe ?
merci bcp deja pour toutes vos reponses upload/852-i1.jpg
a écrit :
J'ai un peu de mal à consulter l'exemple :


As tu essayé au moins de cliquer sur le menu de gauche?

EDIT:

Sur ta page tu n'as aucun DOCTYPE de déclaré
Modifié le 29 Jan 2005 - 16:21
knarf ton menu n'apparrait pas sous firefox mais marche bien sous ie Smiley langue c ptet pour ca qu'il ne la pas vue
Moi je n'ai aucun problème sous firefox je le vois bien mon menu

tu as quoi à la place une croix rouge ?

firefox 1.0
Modifié le 29 Jan 2005 - 16:26
Administrateur
knarf a écrit :
Moi je n'ai aucun problème sous firefox je le vois bien mon menu

tu as quoi à la place une croix rouge ?

firefox 1.0

Même configuration, voilà ce que j'ai à l'écran :
upload/1-rock.gif
c'est dingue ça !

de quoi cela peux venir

bon ba comme l'exemple c'est mort!

le code php est celui-ci

pour les liens:

        <a href="?page=accessibilite">Accessibilité</a> 
        <a href="?page=accueil">Accueil</a>
        <a href="?page=test1">test1</a>



et la partie à inserer ds le bloc cible:

     
if ($_GET['page'] == 'test1')
   
      {include ("test1.php");}

elseif ($_GET['page'] == 'accueil')
   
      {include ("accueil.php");}

elseif ($_GET['page'] == 'accessibilite')

      {include ("accessibilite.php");}

else {include ("defaut.php");}


Modifié le 29 Jan 2005 - 17:41
wacha a écrit :
(...) a la maniere d'une iframe. merci Smiley langue

Pourquoi alors ne pas faire une iframe ? (J'entends déjà les sirènes au loin Smiley cligne ) Si tu veux faire une iframe, choisis le bon DocType et vas-y !

Dans le cas ou tu ne veux pas faire d'iframe, change de méthode ! (pas creusé plus...)

@+, HoPHP
Modifié le 30 Jan 2005 - 17:45
lut Smiley cligne

Avec ce que je t'ai donné ce n'est pas bon ?

bien sur il te faut un serveur ou un hebergeur acceptant le php.


tu n'as juste qu'as changer le nom des pages dans le code.
Pages :