hauteur iframes pas 100 % dans Internet Explorer
- UniquelyYoursPC
- Web Master


- Inscription: Jan 22, 2003
- Messages: 2998
- Loc: Canada "A"
- Status: Offline
Je peux l'obtenir pour fonctionner correctement dans firefox et chrome mais pas IE
Je ne peux pas pour aller de hauteur de 100 % sur IE
et sur Firefox, il va jusqu'à la fin de la page, mais j'ai toujours une barre de défilement...
ce que je souhaite, c'est l'iframe tabed comme on le voit ici http://ca . gigaoctet. com/products/product-page.aspx?pid=3962 #na supprimer les espaces
Code: [ Select ]
<style type="text/css">
div.tabBox {}
div.tabArea {
font-size: 100%;
font-weight: bold;
padding: 0px 0px 3px 0px;
}
a.tab {
background-color: #ffffff;
border: .5px solid #858585;
border-bottom-width: 0px;
border-color: #858585;
-moz-border-radius: .75em .75em 0em 0em;
border-radius-topleft: .75em;
border-radius-topright: .75em;
padding: 2px 1em 2px 1em;
position: relative;
text-decoration: none;
top: 3px;
z-index: 100;
}
a.tab, a.tab:visited {
color: #000005;
}
a.tab:hover {
background-color: #dedede;
border-color: 858585;
color: #858585;
}
a.tab.activeTab, a.tab.activeTab:hover, a.tab.activeTab:visited {
background-color: #858585;
border-color: #858585;
color: #000000;
}
a.tab.activeTab {
padding-bottom: 4px;
top: 1px;
z-index: 102;
}
div.tabMain {
background-color: #ffffff;
border: .5px solid #dedede;
border-color: #dedede;
-moz-border-radius: 0em .5em .5em 0em;
border-radius-topright: .5em;
border-radius-bottomright: .5em;
padding: .5em;
position: relative;
z-index: 101;
}
div.tabIframeWrapper {
width: 100%;
height:100%
}
iframe.tabContent {
background-color: #ffffff;
border: 1px solid #ffffff5;
border-color: #ffffff;
width: 100%;
height: 100%;
}
h4#title {
background-color: #ffffff;
border: 1px solid #ffffff;
border-color: #ffffff;
color: #ffffff;
font-weight: bold;
margin-top: 0em;
margin-bottom: .5em;
padding: 2px .5em 2px .5em;
}
table {height:100%;width:100%;table-layout:static;border-collapse:collapse}
</style>
<script language="JavaScript">
<!--
function resize_iframe()
{
var height=window.innerWidth;//Firefox
if (document.body.clientHeight)
{
height=document.body.clientHeight;//IE
}
//resize the iframe according to the size of the
//window (all these should be on the same line)
document.getElementById("glu").style.height=parseInt(height-
document.getElementById("glu").offsetTop-8)+"px";
}
// this will resize the iframe every
// time you change the size of the window.
window.onresize=resize_iframe;
//Instead of using this you can use:
// <BODY onresize="resize_iframe()">
//-->
</script>
<script type="text/javascript">//<![CDATA[
function synchTab(frameName) {
var elList, i;
// Exit if no frame name was given.
if (frameName == null)
return;
// Check all links.
elList = document.getElementsByTagName("A");
for (i = 0; i < elList.length; i++)
// Check if the link's target matches the frame being loaded.
if (elList[i].target == frameName) {
// If the link's URL matches the page being loaded, activate it.
// Otherwise, make sure the tab is deactivated.
if (elList[i].href == window.frames[frameName].location.href) {
elList[i].className += " activeTab";
elList[i].blur();
}
else
removeName(elList[i], "activeTab");
}
}
function removeName(el, name) {
var i, curList, newList;
if (el.className == null)
return;
// Remove the given class name from the element's className property.
newList = new Array();
curList = el.className.split(" ");
for (i = 0; i < curList.length; i++)
if (curList[i] != name)
newList.push(curList[i]);
el.className = newList.join(" ");
}
//]]></script>
<script language="JavaScript">
<!--
function resize_iframe()
{
var height=window.innerWidth;//Firefox
if (document.body.clientHeight)
{
height=document.body.clientHeight;//IE
}
//resize the iframe according to the size of the
//window (all these should be on the same line)
document.getElementById("glu").style.height=parseInt(height-
document.getElementById("glu").offsetTop-8)+"px";
}
// this will resize the iframe every
// time you change the size of the window.
window.onresize=resize_iframe;
//Instead of using this you can use:
// <BODY onresize="resize_iframe()">
//-->
</script>
<br.<br><br /> put some text here, and a customize now button
<div style="clear: both;" class="tabBox">
<div class="tabArea">
<a target="tabIframe2" href="predatoramd/overview.html" class="tab">Overview</a>
<a target="tabIframe2" href="predatoramd/feature.html" class="tab">Features</a>
<a target="tabIframe2" href="predatoramd/reviews.html" class="tab">Reviews</a>
</div>
<div class="tabMain">
<h4 id="title">Top Picks</h4>
<div class="tabIframeWrapper"><iframe id="glu" width="100%" onload="resize_iframe()" class="tabContent" name="tabIframe2" src="predatoramd/overview.html" marginheight="8" marginwidth="8" frameborder="0"></iframe></div>
</div>
</div>
</br.<br>
div.tabBox {}
div.tabArea {
font-size: 100%;
font-weight: bold;
padding: 0px 0px 3px 0px;
}
a.tab {
background-color: #ffffff;
border: .5px solid #858585;
border-bottom-width: 0px;
border-color: #858585;
-moz-border-radius: .75em .75em 0em 0em;
border-radius-topleft: .75em;
border-radius-topright: .75em;
padding: 2px 1em 2px 1em;
position: relative;
text-decoration: none;
top: 3px;
z-index: 100;
}
a.tab, a.tab:visited {
color: #000005;
}
a.tab:hover {
background-color: #dedede;
border-color: 858585;
color: #858585;
}
a.tab.activeTab, a.tab.activeTab:hover, a.tab.activeTab:visited {
background-color: #858585;
border-color: #858585;
color: #000000;
}
a.tab.activeTab {
padding-bottom: 4px;
top: 1px;
z-index: 102;
}
div.tabMain {
background-color: #ffffff;
border: .5px solid #dedede;
border-color: #dedede;
-moz-border-radius: 0em .5em .5em 0em;
border-radius-topright: .5em;
border-radius-bottomright: .5em;
padding: .5em;
position: relative;
z-index: 101;
}
div.tabIframeWrapper {
width: 100%;
height:100%
}
iframe.tabContent {
background-color: #ffffff;
border: 1px solid #ffffff5;
border-color: #ffffff;
width: 100%;
height: 100%;
}
h4#title {
background-color: #ffffff;
border: 1px solid #ffffff;
border-color: #ffffff;
color: #ffffff;
font-weight: bold;
margin-top: 0em;
margin-bottom: .5em;
padding: 2px .5em 2px .5em;
}
table {height:100%;width:100%;table-layout:static;border-collapse:collapse}
</style>
<script language="JavaScript">
<!--
function resize_iframe()
{
var height=window.innerWidth;//Firefox
if (document.body.clientHeight)
{
height=document.body.clientHeight;//IE
}
//resize the iframe according to the size of the
//window (all these should be on the same line)
document.getElementById("glu").style.height=parseInt(height-
document.getElementById("glu").offsetTop-8)+"px";
}
// this will resize the iframe every
// time you change the size of the window.
window.onresize=resize_iframe;
//Instead of using this you can use:
// <BODY onresize="resize_iframe()">
//-->
</script>
<script type="text/javascript">//<![CDATA[
function synchTab(frameName) {
var elList, i;
// Exit if no frame name was given.
if (frameName == null)
return;
// Check all links.
elList = document.getElementsByTagName("A");
for (i = 0; i < elList.length; i++)
// Check if the link's target matches the frame being loaded.
if (elList[i].target == frameName) {
// If the link's URL matches the page being loaded, activate it.
// Otherwise, make sure the tab is deactivated.
if (elList[i].href == window.frames[frameName].location.href) {
elList[i].className += " activeTab";
elList[i].blur();
}
else
removeName(elList[i], "activeTab");
}
}
function removeName(el, name) {
var i, curList, newList;
if (el.className == null)
return;
// Remove the given class name from the element's className property.
newList = new Array();
curList = el.className.split(" ");
for (i = 0; i < curList.length; i++)
if (curList[i] != name)
newList.push(curList[i]);
el.className = newList.join(" ");
}
//]]></script>
<script language="JavaScript">
<!--
function resize_iframe()
{
var height=window.innerWidth;//Firefox
if (document.body.clientHeight)
{
height=document.body.clientHeight;//IE
}
//resize the iframe according to the size of the
//window (all these should be on the same line)
document.getElementById("glu").style.height=parseInt(height-
document.getElementById("glu").offsetTop-8)+"px";
}
// this will resize the iframe every
// time you change the size of the window.
window.onresize=resize_iframe;
//Instead of using this you can use:
// <BODY onresize="resize_iframe()">
//-->
</script>
<br.<br><br /> put some text here, and a customize now button
<div style="clear: both;" class="tabBox">
<div class="tabArea">
<a target="tabIframe2" href="predatoramd/overview.html" class="tab">Overview</a>
<a target="tabIframe2" href="predatoramd/feature.html" class="tab">Features</a>
<a target="tabIframe2" href="predatoramd/reviews.html" class="tab">Reviews</a>
</div>
<div class="tabMain">
<h4 id="title">Top Picks</h4>
<div class="tabIframeWrapper"><iframe id="glu" width="100%" onload="resize_iframe()" class="tabContent" name="tabIframe2" src="predatoramd/overview.html" marginheight="8" marginwidth="8" frameborder="0"></iframe></div>
</div>
</div>
</br.<br>
- <style type="text/css">
- div.tabBox {}
- div.tabArea {
- font-size: 100%;
- font-weight: bold;
- padding: 0px 0px 3px 0px;
- }
- a.tab {
- background-color: #ffffff;
- border: .5px solid #858585;
- border-bottom-width: 0px;
- border-color: #858585;
- -moz-border-radius: .75em .75em 0em 0em;
- border-radius-topleft: .75em;
- border-radius-topright: .75em;
- padding: 2px 1em 2px 1em;
- position: relative;
- text-decoration: none;
- top: 3px;
- z-index: 100;
- }
- a.tab, a.tab:visited {
- color: #000005;
- }
- a.tab:hover {
- background-color: #dedede;
- border-color: 858585;
- color: #858585;
- }
- a.tab.activeTab, a.tab.activeTab:hover, a.tab.activeTab:visited {
- background-color: #858585;
- border-color: #858585;
- color: #000000;
- }
- a.tab.activeTab {
- padding-bottom: 4px;
- top: 1px;
- z-index: 102;
- }
- div.tabMain {
- background-color: #ffffff;
- border: .5px solid #dedede;
- border-color: #dedede;
- -moz-border-radius: 0em .5em .5em 0em;
- border-radius-topright: .5em;
- border-radius-bottomright: .5em;
- padding: .5em;
- position: relative;
- z-index: 101;
- }
- div.tabIframeWrapper {
- width: 100%;
- height:100%
- }
- iframe.tabContent {
- background-color: #ffffff;
- border: 1px solid #ffffff5;
- border-color: #ffffff;
- width: 100%;
- height: 100%;
- }
- h4#title {
- background-color: #ffffff;
- border: 1px solid #ffffff;
- border-color: #ffffff;
- color: #ffffff;
- font-weight: bold;
- margin-top: 0em;
- margin-bottom: .5em;
- padding: 2px .5em 2px .5em;
- }
- table {height:100%;width:100%;table-layout:static;border-collapse:collapse}
- </style>
- <script language="JavaScript">
- <!--
- function resize_iframe()
- {
- var height=window.innerWidth;//Firefox
- if (document.body.clientHeight)
- {
- height=document.body.clientHeight;//IE
- }
- //resize the iframe according to the size of the
- //window (all these should be on the same line)
- document.getElementById("glu").style.height=parseInt(height-
- document.getElementById("glu").offsetTop-8)+"px";
- }
- // this will resize the iframe every
- // time you change the size of the window.
- window.onresize=resize_iframe;
- //Instead of using this you can use:
- // <BODY onresize="resize_iframe()">
- //-->
- </script>
- <script type="text/javascript">//<![CDATA[
- function synchTab(frameName) {
- var elList, i;
- // Exit if no frame name was given.
- if (frameName == null)
- return;
- // Check all links.
- elList = document.getElementsByTagName("A");
- for (i = 0; i < elList.length; i++)
- // Check if the link's target matches the frame being loaded.
- if (elList[i].target == frameName) {
- // If the link's URL matches the page being loaded, activate it.
- // Otherwise, make sure the tab is deactivated.
- if (elList[i].href == window.frames[frameName].location.href) {
- elList[i].className += " activeTab";
- elList[i].blur();
- }
- else
- removeName(elList[i], "activeTab");
- }
- }
- function removeName(el, name) {
- var i, curList, newList;
- if (el.className == null)
- return;
- // Remove the given class name from the element's className property.
- newList = new Array();
- curList = el.className.split(" ");
- for (i = 0; i < curList.length; i++)
- if (curList[i] != name)
- newList.push(curList[i]);
- el.className = newList.join(" ");
- }
- //]]></script>
- <script language="JavaScript">
- <!--
- function resize_iframe()
- {
- var height=window.innerWidth;//Firefox
- if (document.body.clientHeight)
- {
- height=document.body.clientHeight;//IE
- }
- //resize the iframe according to the size of the
- //window (all these should be on the same line)
- document.getElementById("glu").style.height=parseInt(height-
- document.getElementById("glu").offsetTop-8)+"px";
- }
- // this will resize the iframe every
- // time you change the size of the window.
- window.onresize=resize_iframe;
- //Instead of using this you can use:
- // <BODY onresize="resize_iframe()">
- //-->
- </script>
- <br.<br><br /> put some text here, and a customize now button
- <div style="clear: both;" class="tabBox">
- <div class="tabArea">
- <a target="tabIframe2" href="predatoramd/overview.html" class="tab">Overview</a>
- <a target="tabIframe2" href="predatoramd/feature.html" class="tab">Features</a>
- <a target="tabIframe2" href="predatoramd/reviews.html" class="tab">Reviews</a>
- </div>
- <div class="tabMain">
- <h4 id="title">Top Picks</h4>
- <div class="tabIframeWrapper"><iframe id="glu" width="100%" onload="resize_iframe()" class="tabContent" name="tabIframe2" src="predatoramd/overview.html" marginheight="8" marginwidth="8" frameborder="0"></iframe></div>
- </div>
- </div>
- </br.<br>
Je ne peux pas pour aller de hauteur de 100 % sur IE
et sur Firefox, il va jusqu'à la fin de la page, mais j'ai toujours une barre de défilement...
ce que je souhaite, c'est l'iframe tabed comme on le voit ici http://ca . gigaoctet. com/products/product-page.aspx?pid=3962 #na supprimer les espaces
- Anonymous
- Bot


- Inscription: 25 Feb 2008
- Messages: ?
- Loc: Ozzuland
- Status: Online
Septembre 11th, 2011, 4:11 pm
- UniquelyYoursPC
- Web Master


- Inscription: Jan 22, 2003
- Messages: 2998
- Loc: Canada "A"
- Status: Offline
n'importe qui ont une idée ? ie il montre une trame environ 400 px en hauteur mais dans firefox et le chrome, il montre une trame environ 3 pages en hauteur
Je voudrais ont pas de barres de défilement et avoir la page charger à partir de l'onglet pour charger la page complète
Je serais ouvert à l'utilisation de php si il serait utile.
Je voudrais ont pas de barres de défilement et avoir la page charger à partir de l'onglet pour charger la page complète
Je serais ouvert à l'utilisation de php si il serait utile.
- UniquelyYoursPC
- Web Master


- Inscription: Jan 22, 2003
- Messages: 2998
- Loc: Canada "A"
- Status: Offline
- Bigwebmaster
- Site Admin


- Inscription: Déc 20, 2002
- Messages: 8925
- Loc: Seattle, WA & Phoenix, AZ
- Status: Offline
Quelle version de IE vous utilisaient dans lequel ce problème existe ? Je n'a jamais vu votre autre version avant que vous avez appliqué le correctif, mais je devine qu'il devrait y avoir un moyen de résoudre ce problème sans avoir à recourir à l'utilisation de JavaScript. Si vous pouvez placer une page temporaire à un endroit qui montre encore la question I might be capable d'aider
Ozzu Hosting - Want your website on a fast server like Ozzu?
- UniquelyYoursPC
- Web Master


- Inscription: Jan 22, 2003
- Messages: 2998
- Loc: Canada "A"
- Status: Offline
Page 1 sur 1
Pour répondre à ce sujet, vous devez vous connecter ou vous enregistrer. Il est gratuit.
Afficher de l'information
- Total des messages de ce sujet: 6 messages
- Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 258 invités
- Vous ne pouvez pas poster de nouveaux sujets
- Vous ne pouvez pas répondre aux sujets
- Vous ne pouvez pas éditer vos messages
- Vous ne pouvez pas supprimer vos messages
- Vous ne pouvez pas joindre des fichiers

