Iframe images visibles impression

[Résolu]
Signaler
Messages postés
436
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
2 juillet 2014
-
Messages postés
436
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
2 juillet 2014
-
Bonjour,

Je voudrais integrer une iframe pour mon site web mais qui cache les images (qui elles seront visibles à l'impression).

En fait, sur mon site je présente des produits, avec un petit listing de tous les produits dans un 1er lieu, et on peux cliquer sur "plus de details" et la fiche technique produit apparait en nouvelle page avec une photo de produit (rien d'anormal !), et ma solution pour eviter d'ouvrir une nouvelle page est d'y intégrer des iframe.
Mon problème, est que la photo prend TROP de place dans l'iframe, et je voudrais la cacher à l'écran mais la rendre visible à l'impression uniquement.

Quelqu'un pourrait-il me dire si c'est possibe ?

Merci d'avance.

Ju'

9 réponses

Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
Bonjour,

dieu me tripote ? j'ai pas déjà répondu ?
mon message se perdit dans les méandres de la toile ?

je reprend donc :

tout ce qui s'impressionne est géré avec le css :

exemple :
@media print
            {.InEo    {    visibility:hidden;    }    /* ne pas imprimer, visible à l'écran */
             .IoEn    {    visibility:visible;    }    /* imprimer, invisible à l'écran */
             .IoEo    {    visibility:visible;    }    /* imprimer, visible à l'écran ;o) */
            }
@media screen
            {.InEo    {    visibility:visible;    }   
             .IoEn    {    visibility:hidden;    }
             .IoEo    {    visibility:visible;    }
            }

pour plus d'infos voir chez selfHTML par exemple

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
436
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
2 juillet 2014
4
bonjour !

InEo et IoEn sont les noms des calques ?
Et que signifie "@" dans ton exemple ?

Merci de ta réponse
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
>>InEo et IoEn sont les noms des calques ?
euh ? c'est quoi un calque ?
par contre si tu me demande coment ça se met : <élément class="InEo"... /> par exemple

>>Et que signifie "@" dans ton exemple ?
ce qui est marqué, tout simplement
@media print pour l'impression, @media screen pour l'écran.

consulte aussi la doc, elle est en français, gratis,
téléchargeable, une version html une chm...

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
j'ai oublié de repréciser que c'était du css, donc entre balises <style> et </style> "bien sûr"
<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
436
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
2 juillet 2014
4
oui oui bien sur lol sans soucis (pour le <style> et </style>)
mais je ne comprend pas en fait ce que tu as marqué pour le reste.

voici ce que j'ai mis :

ça c'est dans ma page HTML :
<link rel="stylesheet" type="text/css" media="screen" href="print.css" />

et ça mon CSS :

/*  début de la Partie a ne PAS imprimer  */
#image{
  visibility: hidden;
}
 
#bas{
  visibility: hidden;
}
/*  fin de la Partie a ne PAS imprimer  */





/*  début de la Partie a imprimer  */
#corps{
  background-color:#FFFFFF;
  display:block;
  clip:auto;
  overflow:visible;
}
  /*  fin de la Partie a imprimer  */

J'ai découpé ma page en 3 calques : l'un nommé "image" et qui ne doit pas apparaitre à l'écran mais uniquement à l'impression, pareil pour le calque "bas", par conter pour le calque (corps) il doit apparaitre tout le temps. Et aussi il y a un autre problème que j'ai, c'est que quand j'aimerais que l'image (qui nest normalement au dessus de tout) décale automatiquement le "CORPS" quadn elle est visible et qu'elle ne passe ni devant ni derriere l'autre calque.

Tu vois ce que je veux dire ?

Merci à toi
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
si tu veux  qu'un élément soit imprimé sans le voir à l'écran :

<head>
<style>
@media print
            {.IoEn    {    visibility:visible;    }  }    ou display:inline
@media screen
            {.IoEn    {    visibility:hidden;    }  }    ou display:none
<style>
</head>

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
436
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
2 juillet 2014
4
yeees merci ça marche tip top !
Il y a juste un dernier petit probleme, à l'impression tous les calques sont superposés !  comment peux-tu faire pour définir leur emplacement les uns et dessous des autres stp ?

Merci :) :) :)
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
je ne sais pas. trop peu d'infos.
en n'oubliant pas que imprimer en js c'est window.print et
rien de plus et que c'est exactement la même chose que
"Fichiers" "imPrimer"  avec le navigateur.
<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
436
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
2 juillet 2014
4
oui ça au moins je sais deja ! lol
ok bah merci je crois que j'ai trouvé. maintenant j'ai d'autres problèmes mais à mon avis c'est dans un code PHP que j'aurais la réponse.

MErci à toi bonne jounrée @ +