hoogte iframe aanpassen

Status
Niet open voor verdere reacties.
W

whitetigerck

Gebruiker
Lid geworden
8 aug 2008
Berichten
196
Hallo,

Ik heb een mooi inklapmenut gemaakt met phpfiletree. Dat werkt uitstekend. Alleen als men alles uitklapt dan zie je een vervelende scrollbar staan en dat wil ik niet echt. Is er misschien een javascriptcode die dat voorkomt? Hier zie je de desbetreffende pagina staan.

Dus of dat hij dat menu heel even uitklapt en dan automatisch de max hoogte daarvan neemt, maar het nadeel daarvan is dat ik vanonder een groot leeg gedeelte heb.

Of wat ik liever wil (maar net zoals optie 1, heb ik geen flauw idee hoe dat moet:p)
Telkens als je dat menu uitklapt berekend het javascript opnieuw de max-height en veranderd zo de hoogte van het iframe. Maar hoe moet dat?

Dit is de code die ik nu heb voor het automatisch aanpassen van het iframe
[JS]//Input the IDs of the IFRAMES you wish to dynamically resize to match its content height:
//Separate each ID with a comma. Examples: ["myframe1", "myframe2"] or ["myframe"] or [] for none:
var iframeids=["myframe"]

//Should script hide iframe from browsers that don't support this script (non IE5+/NS6+ browsers. Recommended):
var iframehide="yes"

var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers

function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids)
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getElementById) && iframehide=="no"){
var tempobj=document.all? document.all[iframeids] : document.getElementById(iframeids)
tempobj.style.display="block"
}
}
}

function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}

function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}

function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}

if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller
[/JS]

en dit is de js code van phpfiletree:
[JS]/*

== PHP FILE TREE JAVASCRIPT EXTENSION ==

Based on the Expandable Listmenu Script by Daniel Nolan
http://www.bleedingego.co.uk/webdev.php

Modified by Cory S.N. LaViska
http://abeautifulsite.net/

== WHAT IT DOES ==

This script makes the nested lists created by PHP File Tree expand and
collapse dynamically.

== USAGE ==

Include the script into the <head></head> section of the appropriate
page(s) as shown below:

<script src="php_file_tree.js" type="text/javascript"></script>

All file trees generated by PHP File Tree will automatically collapse to
the top level (as specified by $directory) and become dynamic.

== FAQS ==

Q Can I have more than one file tree on one page?
A Yes. You can have as many as you want and they will all function as expected.

*/

function init_php_file_tree() {
if (!document.getElementsByTagName) return;

var aMenus = document.getElementsByTagName("LI");
for (var i = 0; i < aMenus.length; i++) {
var mclass = aMenus.className;
if (mclass.indexOf("pft-directory") > -1) {
var submenu = aMenus.childNodes;
for (var j = 0; j < submenu.length; j++) {
if (submenu[j].tagName == "A") {

submenu[j].onclick = function() {
var node = this.nextSibling;

while (1) {
if (node != null) {
if (node.tagName == "UL") {
var d = (node.style.display == "none")
node.style.display = (d) ? "block" : "none";
this.className = (d) ? "open" : "closed";
return false;
}
node = node.nextSibling;
} else {
return false;
}
}
return false;
}

submenu[j].className = (mclass.indexOf("open") > -1) ? "open" : "closed";
}

if (submenu[j].tagName == "UL")
submenu[j].style.display = (mclass.indexOf("open") > -1) ? "block" : "none";
}
}
}
return false;
}

window.onload = init_php_file_tree;[/JS]

Hopelijk hebben zoals altijd een goede oplossing voor dit probleem:thumb:
 
Nee, die krijg je pas ook als je op menu (waar HWP partijen, HZ toernooi 2009 etc. staat) klikt en alles openklapt. En als je alles openklikt dan krijg je die scrollbar pas.
 
Ooh ja, klopt. Ik had nog een van de submenus niet opengeklapt.

In je code staat:

HTML: 
<iframe width="100%" src="http://www.hwpsasvangent.nl/png_games/testgames4.php?pgn=HWP%20partijen/Bekerwedstrijd/Bekerwedstrijd%2025-1-08.pgn" height="1250px" frameborder="0">

Daar stel je de hoogte van het iframe automatisch op 1250px. Niet goed dus. Waarschijnlijk is het opgelost als je van 1250px -> auto maakt.
 
dat werkte ook niet, ik kom er nu pas achter dat dat script IE only is:o
En dat terwijl ik firefox gebruik:p

Daarom had ik hem dus op 1250px gezet.
Ik ben nu bezig met het probleem te omzeilen door de iframe weg te werken en ze allemaal in een div te zetten met 2 verschillende getvariabelen.
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan