LégER problème, avec CSS et balise et 'Fausse Popup' [TITRE CORRIGE...]

Bonjour,

en faite j'ai un p'tit défaut avec les balise html <a> et certainement <div> et je pense a une option que je ne dois connaitre via les CSS, en fin je suis pas sure (pour ça que je post d'ailleur ... )

En faite, j'ai trouvé une source de "fausse popup" sur ce site que j'ai trouver plustot intéressant, je l'ai mis, et fonctionne nickel mais le problème, c'est que tout mes liens Hypertexte passe au premier plan et ne sont pas caché par la couche ....

J'aimerai savoir si vous connaissez un moyen pour y rémédier . Merci d'avance.

Salut!
Pour commencer, on bosse plutôt sur du php que sur du HTML/CSS, ici... :D

Tu peux nous montrer le(s) code(s) concerné(s) ? :)

@++

R@f

www.allpotes.ch: Photos, humour, vidéos, gags, ...

"On dit que seulement 10 personnes au monde comprenaient Einstein. Personne ne me comprends. Suis-je un génie???"

Salut,

Etonnant !!! As-tu spécifier une couleur de fond pour ton calque ("fausse popup"). Sinon, il est transparent...


Normalement, ce Pb arrive avec IE et les éléments HTML <select>. Et pour ce lamentable bug de IE, je te renvoi sur cette source : [ Lien ]


A+

Oui c'est vrai que je me suis un peux gourré de sections, en faite, j'ai 3 voir 4 type de code différent ... HTML/CSS, PHP, et JScript.

Si non, mon problème ne vient pas de <select>, je vous donne la partie CSS qui gène ainsi que les ligne au quel ça dérange =>

---- CSS ---- [ Utilisé par IE ]

    .link a
        { font-family: Arial; font-size: 13px; color: #0066CC; text-align: center; text-decoration: underline; font-weight: normal;}
    .link a:visited
        { font-family: Arial; font-size: 13px; color: #0066CC; text-align: center; text-decoration: underline; font-weight: normal;}
    .link a:hover
        { font-family: Arial; font-size: 13px; color: red; text-align: center; text-decoration: underline; font-weight: normal;}
    .link a:active
        { font-family: Arial; font-size: 13px; color: red; text-align: center; text-decoration: underline; font-weight: normal;}
       
    .medium a
        { font-family: Tahoma; font-size: 17px; color: #6C1796; font-weight: normal; border-style: solid; border-width: 1px; background-image: url(../image/applet/bck_gd_nor.gif); text-align: center; width: 250px; height:26px;}
    .medium a:visited
        { font-family: Tahoma; font-size: 17px; color: #6C1796; font-weight: normal; border-style: solid; border-width: 1px; background-image: url(../image/applet/bck_gd_nor.gif); text-align: center; width: 250px; height: 26px;}
    .medium a:hover
        { font-family: Tahoma; font-size: 15px; color: #6C17CC; font-weight: normal; border-style: solid; border-width: 1px; background-image: url(../image/applet/bck_gd_hov.gif); text-align: center; width: 246px; height: 24px;  top: +0px;}
    .medium a:active
        { font-family: Tahoma; font-size: 13px; color: #6C17CC; font-weight: normal; border-style: solid; border-width: 1px; background-image: url(../image/applet/bck_gd_hov.gif); text-align: center; width: 242px; height: 22px; top: +0px;}

---- La Page Concerné ----

if ($page=='Accueil' and $connect=='oui') {
      if ($acces=="admin" or $acces=="total") $ad='<tr><td align="center" class="medium"><table><a href="admin/admin.php">Administrations</a></table></td></tr>';
      echo '
        <table height="2%" width="80%">
            <tr>
                <td align="Left"><font face="Verdana" size="2">Compte Utilisateur : <i>'.$user.'</i></font></td>
            </tr><tr>
                <td align="Left"><div class="dibis"><span id="defileH1" onMouseover="defileH_1.delta=0" onMouseout="defileH_1.delta=deltaV1" class="defbis">Liste Des Salons IRC : '.$list_chan.'</span></div></td>
            </tr>
        </table><br>
        <table height="30%">
            <td align=center height="100%">
            <tr>
            </tr><tr>
                <td align="center" class="medium"><table><a href="perso.php?page='.$acces.'">Personnaliser</a></table></td>
            </tr><tr>
                <td align="center" class="medium"><table><a href="index.php?page=pub">Infos / PUB</a></table></td>
            </tr>'.$ad.'<tr>
                <td align="center" class="medium"><table><a href="'.$win.'">Lancez le Chat</a></table></td>
            </tr><tr>
                <td align="center" class="medium"><table><a href="index.php?page=aide">Aide</a></table></td>
            </tr><tr>
            </tr>
            </td>
        </table>
        <table height="40px" >
            <tr>
                <td align=center><input class="submit_w8" type="submit" name="page" value="Deconnection"></td>
                </form>
            </tr>
        </table>
    ';
}

---- "La Fausse Popup" ---- [ a ce qui parrait c'est du DHTML, ou alors c'est l'alcool , pas convaincu ... ]


function popup(){
    if (document.getElementById) {
        document.write('<style type="text/css">')
        document.write('table.popup {')
        document.write('    border: 1px solid #000000;}')
        document.write('td.titre {')
        document.write('    font-family: '+policeBarretitre+';')
        document.write('    font-size: '+taillePoliceBarretitre+'px;')
        document.write('    color: '+couleurPoliceBarretitre+';}')
        document.write('td.corps {')
        document.write('    font-family: '+policeCorps+';')
        document.write('    font-size: '+taillePoliceCorps+'px;')
        document.write('    color: '+couleurPoliceCorps+';}')
        document.write('</style>')
        document.write('<DIV id=pop_up STYLE="position:absolute; top:'+topFenetre+'px; left:'+leftFenetre+'px;visibility:visible;">')
   
        if (Ombre == 1 ) {
            document.write('<table width="'+largeurFenetre+'" height="'+hauteurFenetre+'" border="0" cellspacing="0" cellpadding="0">')
            document.write('<tr> ')
            largeurFenetre -= 5
            hauteurFenetre -= 5
            document.write('<td width="'+largeurFenetre+'"  height="'+hauteurFenetre+'" colspan="2" rowspan="2" align="left" valign="top">')
        }
      
        document.write('<table width="'+largeurFenetre+'"  height="'+hauteurFenetre+'" border="0" cellspacing="0" cellpadding="0" class="popup">')
        largeurFenetre -= hauteurBarretitre
        hauteurFenetre -= hauteurBarretitre
        document.write('<tr onMouseDown="clicDown()" onMouseUp="clicUp()">')
        document.write('<td bgcolor="'+couleurHaut+'" class="titre" width="'+largeurFenetre+'" height="'+hauteurBarretitre+'" style="cursor: move">' + texteBarretitre +'</td>')
        document.write('<td bgcolor="'+couleurHaut+'" class="titre" width="13" height="'+hauteurBarretitre+'"><img src="image/popup/image.gif" width="13" height="13" onClick="fermerPopup()"></td>')
        document.write('</tr>')
        document.write('<tr valign="top">')
        document.write('<td bgcolor="'+couleurBas+'" width="'+largeurFenetre+'" height="'+hauteurFenetre+'" colspan="2" class="corps">'+texteCorps+'</td>')
        document.write('</tr>')
        document.write('</table>')
   
        if (Ombre == 1 ) {
            document.write('</td>')
            document.write('<td width="5" height="5" background="image/popup/image6.gif"></td>')
            document.write('</tr>')
            document.write('<tr>')
            document.write('<td background="image/popup/image2.gif" width="5" height="'+hauteurFenetre+'"></td>')
            document.write('</tr>')
            document.write('<tr> ')
            document.write('<td height="5" width="5" background="image/popup/image5.gif"></td>')
            document.write('<td height="5" width="'+largeurFenetre+'" background="image/popup/image3.gif"></td>')
            document.write('<td height="5" width="5" background="image/popup/image4.gif"></td>')
            document.write('</tr>')
              document.write('</table>')
        }
        document.write('</div>')
    }
}

-----------------

Voilà, je n'ai mis que les grandes lignes, si vous désirez voir exactement ce que ça fait =>

http://vince02100.dyndns.org/shonen/new/index.php

créé vous un compte, ou utilisait ce compte (Login : test   -    Passe : test ), inutile de donner vos infos verritable, je n'ai pas mis de verif de mail etc ... une fois le compte créé, logué vous, et jetter un oeil sur l'accueil, c'est flagrant ^^

et vous constaterais mon p'tit bug lorsque l'on fait glisser la "fenêtre" devant les liens hyper-texts ^^

J'ai aussi essayer dans le CSS la fonction Visibility et Z-index, ça fait rien du tout

Si il vous manque quelque chose, dite moi.

re-...

Je suis allé faire un petit tour sur la dite page. C'est chouette ! Bon, mais y'a aussi les images qui passent par dessus le calque. Et si un truc est sûr... c'est que c'est pas normal.

Un petit tour dans la source de l'index et les trois dernieres lignes ne m'inpirent pas confiance... Les voici :

		</body>

	</div>
</html>

Tu fermes ta <div> principale après la fermeture du document. Donc elle n'est pas prise en compte ! Peut-être est-ce la source de l'erreur.

Sinon... (entre autres)

* Tu pourras essayer d'ouvrir ta popup avant le reste du document (juste après le <body>)

* Perso, j'ai jamais vu un Z-index fonctionner ! A bon entendeur...

* Tu auras le problème des <select>... C'est sûr ! Et avec ta politique de glissage-de-popup ça va être tendu. Le plus facile sera d'éviter de mettre les deux sur la même page :(

* Tu utilises se genre de structure : <a><span><table><td><img /></td></table></span></a>... C'est pas conseillé et je ne vois pas l'intéret de faire un tableau avec une seule cellule... (Ca sent le mauvais DreamWeaver à plein nez!!!)

* Tu fermes deux fois ton formulaire, dont une fois après le <input class="submit_w8" type="submit" name="page" value="Connection" class="input">... C'est louche !

* Par ailleur : il y'a deux fois l'attribut "class" dans cet input...?


Bref, bref... Ton script JS est très joli. Mais des progrès restent à faire en HTML ;)

A+

faut dire que je débute depuis quelque moi, et j'utilise aucun éditeur de type "Wiziwyg" je fais quasiment tout avec PHP Designer et NotePad pour les modif rapid ^^ ...

En faite, ce que je voulais faire, avec cette 'fausse popup' : remplacer le système des i (les icônes) par un click, la popup s'affiche avec l'aide qui va bien.

En même temps, l'internaute, ne sera pas obligé de laisser la souris sur l'icône pour lire ce qui est marqué.

[ en ce moment, tu passes ta souris dessus, tu as un cadre qui apparait, et celon la longueur du texte, ça défile et en plus ça me parait lourd, et le défilement fais bizard sous FireFox ... ça sacade de trop des fois ] 

Si non, je prends en compte la solution que tu m'as filé pour les select et essayer d'adapté ça ^^ de même pour les balises, c'est vrai que je répète 50 fois la même class dans une seule balise pas bien ... :s

Bin bofff, ça ne vas pas comme je le souhaite ... Pas grave, je trouverais un autre moyen qui vas bien, et merci de vous être dérangé pour presque pas grand chose ....

Là maintenant, c'est plus une question en raport PHP cette fois-ci :
Actuellement, j'ai 2 script php dans une iframe rafraichis par une fonction jscript toute les 1m30, une dans l'index, qui vérifis dans la bdd si il y a eu news/infos/pub .. et une sur le chat, pareil en iframe, qui vérifi en gros si l'internaute est bans ou si le Serveur IRC vas être à l'arrêt ou non.

Les 2 scripts sont dans une seule et même fonctions (une brêve du script en gros..)

Ce que je voudrais savoir, c'est : Est-ce qu'il est possible d'employer une autre méthode que le 'Iframe + raffraichissement de page (window.location = "" ) '  pour lancer un script en boucle ?

(sans pour autant saturer le serveur)

window.setTimeout('nom_fonction',123 secondes);

Merci, mais c'est ce que j'utilise déjà ... Ce que je voudrais savoir, c'est si il n'y a pas d'autre moyen que d'utilisé des rafraichissement simple de page...

Car sous FireFox, sur le Chat, lorsque tu veux taper ton texte, comme par hazar, pas de bolle, l'iframe se recharge, et tu te rends compte que tu tape dans le vide ... pas trop cool. Par contre sous IE, aucun problème ça tourne.

J'ai aussi essayé de mettre dans la fonction, qui est justement lancé avec setTimeout : document.pjirc.requestSourceFocus(); mais bon, ça change rien, et aussi : document.pjirc.sendString(""); qui fait que dal aussi .

Désolé, mais mon "expertise" en JS s'arrète là...

A+

Ps : requestSourceFocus et sendString ne ressemblent pas à des fonctions de la W3C... Mais je peux me tromper.