8
votes

iframe avec une position fixe CSS: possible?

J'aimerais ajouter des annonces sur un site Web externe, pour le faire, j'utilise iframe:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body style="background:#ddd">
<center>My ad</center>
<iframe src="http://www.google.com" style="position:fixed; top:50px; left:0; width: 100%; bottom: 0; border: 0 ">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>

html iframe

0 commentaires

4 Réponses :

0
votes

juste faire:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <body style="background:#ddd">
        <center>My ad</center>
        <div style="position:fixed; top:50px; left:0; width: 100%; bottom: 0; border: 0 ">
            <iframe src="http://www.google.com" style="width: 100%; height: 100%; border: 0">
                <p>Your browser does not support iframes.</p>
            </iframe>
        </div>
    </body>
</html>

1 commentaires

Cela fonctionne presque, mais le contenu du contenu de l'iframe sera inférieur au bas du conteneur, en raison de la combinaison de haut: 50px et de hauteur: 100%

2
votes

Essayez d'ajouter une étiquette de style et d'un style Iframe.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<style type='text/css'>
     body { background-color: #DDD; margin: none; }
     iframe { position: fixed; top: #px; left: #px; }
</style>
<body>
<center>My ad</center>
<iframe src="http://www.google.com" border="0">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>

0 commentaires

23
votes

Je sais que c'est un peu tardif, mais j'ai trouvé cette question via Google et des autres sans doute. Si vous souhaitez fixer la position d'un iframe de la même manière, vous fixez la position d'un DIV, vous pouvez l'envelopper dans une position fixe DIV et rendre la taille 100%.

Ce code étend l'IFRAME sur toute la page Espace pour un menu en haut. P>

CSS: P>

<div id='idiv'>
     <iframe id="iframe_main"> 
     </iframe>
</div>

1 commentaires

Merci. Pourquoi les iframes ne fonctionnent pas comme d'autres éléments, cependant?

0
votes

Pourquoi ne retirez-vous pas l'attribut CSS "TOP: 50PX"? Ensuite, le "fond" fonctionnerait bien.

0 commentaires