Affichage d'un PDF dans la page avec "onmouseover"
Bonjour,
Souhaitant faire afficher un PDf sur une portion de ma page .html avec le survol de la sourie sur un texte, j'ai opter pour la combinaison onmouseover + document.getbyelementid + embed (iframe ne fonctionne pas dans mon cas)
le code est fonctionnel mais ne répond pas exactement a mon besoin...
d'abord le code puis mes espérances
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| #eval{
position:absolute;
left:19.63%;
top:31.91%;
width:79.36%;
height:66.7%;
}
#texte_eval {
position:absolute;
left:13.3%;
top:76%;
font-size: 0.9em;
}
#texte_eval:over {
position:absolute;
left:13.3%;
top:76%;
font-size: 0.9em;
} |
Code:
1
2
3
4
5
6
7
| <div id="corps">
<div id="texte_eval">
<h1><a href="#" onmouseover="document.getElementById('eval').style.visibility = 'visible';"
onmouseout="document.getElementById('eval').style.visibility = 'hidden';">mon pdf</a></h1>
</div>
<embed id="eval" src="mon_pdf.pdf#toolbar=0" frameborder="0" height="100%" width="100%"></embed>
</div> |
et maintenant mes deux problèmes avec ce code :
1/ le pdf est visible des le chargement de la page et un premier "onmouseover" doit être fait pour le voir disparaître et remplir sa véritable fonction (comme plusieurs PDF doivent être visualisés au même endroit sur le même principe sur plusieurs liens, ça deviens problématique)
2/ le second problème viens du fait de l'espace réduit pour afficher le PDF, du coup, il y a un ascenseur sur le PDF mais des que je sort la sourie du texte pour me jeter le PDF...pouf plus de PDF.
bref faudrait réussir a garder le "lien" actif sur la droite, j'y suis arrivé a force de <span> et autre <br> mais vers le bas
voici le second code qui diffère pas tant que ça du premier mais je le trouve plus.... "capilotracté"
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
| #eval{
position:absolute;
left:19.63%;
top:31.91%;
width:79.36%;
height:66.7%;
}
#texte_eval {
position:absolute;
left:13.3%;
top:76%;
font-size: 0.9em;
} |
Code:
1
2
3
4
5
6
7
8
9
| <!-- on mousse over eval -->
<div id="corps"> <!-- on mousse over eval -->
<div id="texte_eval">
<span onmouseover="document.getElementById('eval').style.visibility = 'visible';">
<h1><span onmouseout="document.getElementById('eval').style.visibility = 'hidden';">
<a href="#">mon pdf</a></h1>
<span><embed id="eval" src="mon_pdf.pdf#toolbar=0" frameborder="0" height="100%" width="100%"></embed></span><br>
</span></span><br>
</div> |
Donc voila, je suppose qu'il y a un moyen en jouant sur la position de mon texte et du onmouseout mais j'ai beau le tourner et le retourner dans tous les sens (sauf le bon bien sur), j'y arrive pas.
Voila si quelqu'un a un idée magique, je suis preneur...Ha! oui, je débute et je viens a peine de commencer a regarder du coté PHP il y a moins de 24h...si possible je préférerai une solution HTML / CSS ( si bien sur cela est possible)
une autre petite précision si on remplace "embed" par "iframe" lorsqu'il n'a pas de pdf, on a bien un genre de page broken qui s'affiche en lieu et place mais dés que le lien est valide...bah ça fonctionne plus.
Merci d'avance
