Afficher un pdf dans une page web
Résolu/Fermé
A voir également:
- Afficher un pdf dans une page web
- Supprimer une page word - Guide
- Traduire une page web - Guide
- Lire le coran en français pdf - Télécharger - Histoire & Religion
- Enregistrer une page web en pdf - Guide
- Comment faire un pdf - Guide
6 réponses
J'ai trouvé! Voila mon code :
Le CSS:
<style>
#overlay {
display : none;
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
text-align: center;
background-color: rgba(0,0,0,0.5);
}
#overlay img {
margin-top: 100px;
}
iframe {
margin-top : 50px;
width: 70%;
height: 80%;
align:middle;
}
</style>
</head>
HTML:
<body>
<div id="overlay"></div>
<INPUT type="button" onClick="javascript:Truc()">
Le JavaScript:
<script>
function Truc() {
displayImg(this);
return false;
};
function displayImg(link) {
overlay = document.getElementById('overlay');
overlay.innerHTML = '<iframe src="MONFICHIER.pdf"></iframe>';
overlay.style.display = 'block';
}
document.getElementById('overlay').onclick = function() {
this.style.display = 'none';
};
</script>
</body>
</html>
Le CSS:
<style>
#overlay {
display : none;
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
text-align: center;
background-color: rgba(0,0,0,0.5);
}
#overlay img {
margin-top: 100px;
}
iframe {
margin-top : 50px;
width: 70%;
height: 80%;
align:middle;
}
</style>
</head>
HTML:
<body>
<div id="overlay"></div>
<INPUT type="button" onClick="javascript:Truc()">
Le JavaScript:
<script>
function Truc() {
displayImg(this);
return false;
};
function displayImg(link) {
overlay = document.getElementById('overlay');
overlay.innerHTML = '<iframe src="MONFICHIER.pdf"></iframe>';
overlay.style.display = 'block';
}
document.getElementById('overlay').onclick = function() {
this.style.display = 'none';
};
</script>
</body>
</html>
Skeletyon
Messages postés
1552
Date d'inscription
jeudi 20 novembre 2008
Statut
Membre
Dernière intervention
30 décembre 2013
156
16 mai 2012 à 11:25
16 mai 2012 à 11:25
Bonjour.
Personnellement pour du PDF je suis passé par la librairie PHP2PDF. Il en existe d'autre, à vous de trouver celle qui vous correspond le mieux. Des tutos et exemples sont disponibles un peu partout sur le net.
Pour ma génération de PDF j'ai fais un formulaire avec un bouton de génération avec toutes les infos dont j'ai besoin.
Envoi en POST sur une autre page (vous pouvez, je pense, le faire en "alert" sans trop de soucis) et ensuite la librairie pour la mise en page, les textes, les images etc.
L'adapter à votre contexte ne devrait pas être sorcier.
Personnellement pour du PDF je suis passé par la librairie PHP2PDF. Il en existe d'autre, à vous de trouver celle qui vous correspond le mieux. Des tutos et exemples sont disponibles un peu partout sur le net.
Pour ma génération de PDF j'ai fais un formulaire avec un bouton de génération avec toutes les infos dont j'ai besoin.
Envoi en POST sur une autre page (vous pouvez, je pense, le faire en "alert" sans trop de soucis) et ensuite la librairie pour la mise en page, les textes, les images etc.
L'adapter à votre contexte ne devrait pas être sorcier.
kernelmed
Messages postés
26
Date d'inscription
mardi 15 mai 2012
Statut
Membre
Dernière intervention
14 juin 2012
1
16 mai 2012 à 11:47
16 mai 2012 à 11:47
C'est ça que tu veux ?
http://jc-cornic.developpez.com/tuto...s/phpToPDF.zip
http://jc-cornic.developpez.com/tuto...s/phpToPDF.zip
Je ne suis pas sure que phpToPdf réponde a mon problème... Je vais donc décrire ce que j'ai et souhaiterai obtenir.
Donc, j'ai une page qui affiche les résultats d'une recherche par mots clés (J'obtiens un lien pointant vers des fichiers hébergés sur mon serveur) et les affiches sur une page. Durant l'affichage je met un bouton "Afficher" sous chaque item.
je voudrais que lorsque l'on appui sur ce bouton, le pdf pointé apparaisse dans équivalent d'un alert en JavaScript, c'est a dire pas dans la page ou pas dans une nouvelle page... Mais en "avant" de la page actuel...
Donc, j'ai une page qui affiche les résultats d'une recherche par mots clés (J'obtiens un lien pointant vers des fichiers hébergés sur mon serveur) et les affiches sur une page. Durant l'affichage je met un bouton "Afficher" sous chaque item.
je voudrais que lorsque l'on appui sur ce bouton, le pdf pointé apparaisse dans équivalent d'un alert en JavaScript, c'est a dire pas dans la page ou pas dans une nouvelle page... Mais en "avant" de la page actuel...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Skeletyon
Messages postés
1552
Date d'inscription
jeudi 20 novembre 2008
Statut
Membre
Dernière intervention
30 décembre 2013
156
Modifié par Skeletyon le 18/05/2012 à 08:38
Modifié par Skeletyon le 18/05/2012 à 08:38
Bha si votre PDF existe déjà... Et que vous savez afficher un PDF...
J'ai regardé vite fait et je pense que c'est dans les specs de window.open qu'il faut se pencher.
J'ai vu un début d'aide ici: https://www.developpez.net/forums/d207284/javascript/general-javascript/fenetre-popup-bloquante/ le principe de la pop-up bloquante doit pas être loin de ça.
Et ici : https://www.w3schools.com/jsref/met_win_open.asp
J'avoue ne jamais avoir testé ça, mais ça existe. Le plus souvent une pop-up simple suffit à la majorité des utilisations.
Le mieux sinon serait d'aller sur un site qui le propose, la plupart du temps les site type e-commerce et regarder les fonctions javascript utilisées pour la validation du panier.
Vous aurez au moins une idée, voir la solution.
PS: si vous trouvez la solution, postez là, ça m'intéresse :-)
HF & GL
J'ai regardé vite fait et je pense que c'est dans les specs de window.open qu'il faut se pencher.
J'ai vu un début d'aide ici: https://www.developpez.net/forums/d207284/javascript/general-javascript/fenetre-popup-bloquante/ le principe de la pop-up bloquante doit pas être loin de ça.
Et ici : https://www.w3schools.com/jsref/met_win_open.asp
J'avoue ne jamais avoir testé ça, mais ça existe. Le plus souvent une pop-up simple suffit à la majorité des utilisations.
Le mieux sinon serait d'aller sur un site qui le propose, la plupart du temps les site type e-commerce et regarder les fonctions javascript utilisées pour la validation du panier.
Vous aurez au moins une idée, voir la solution.
PS: si vous trouvez la solution, postez là, ça m'intéresse :-)
HF & GL
Skeletyon
Messages postés
1552
Date d'inscription
jeudi 20 novembre 2008
Statut
Membre
Dernière intervention
30 décembre 2013
156
21 mai 2012 à 11:28
21 mai 2012 à 11:28
L'utilisation de l'iframe est obligatoire?
Le passage par div est possible? Si je comprend bien tout se passe dans le CSS? Donc par Div ça doit être possible?
Merci d'vaoir partagé en tout cas, ça servira ;-)
Mets toi en résolu :p
Le passage par div est possible? Si je comprend bien tout se passe dans le CSS? Donc par Div ça doit être possible?
Merci d'vaoir partagé en tout cas, ça servira ;-)
Mets toi en résolu :p
A priori l'utilisation de l'iframe est obligatoire... Enfin je n'ai pas trouvé d'autre façon de procéder.
Oui le passage par div est possible, j'ai trouvé une autre solution l'utilisant ici : http://www.javascriptfr.com/codes/FAUSSE-POPUP-AVEC-EFFET-TRANSPARENCE_41941.aspx
Mais cette solution m'a l'air un peu lourde pour ne juste afficher qu'un pdf (je pense qu'elle serait plus utile dans le cas d'un affichage avec beaucoup de variable). Dans cette technique aussi, cela se passe dans le CSS...
Si ça peut aider! :)
J'ai envoyé une requête pour le passer en résolue, le post devrait bientôt y passer...
Oui le passage par div est possible, j'ai trouvé une autre solution l'utilisant ici : http://www.javascriptfr.com/codes/FAUSSE-POPUP-AVEC-EFFET-TRANSPARENCE_41941.aspx
Mais cette solution m'a l'air un peu lourde pour ne juste afficher qu'un pdf (je pense qu'elle serait plus utile dans le cas d'un affichage avec beaucoup de variable). Dans cette technique aussi, cela se passe dans le CSS...
Si ça peut aider! :)
J'ai envoyé une requête pour le passer en résolue, le post devrait bientôt y passer...
