[HTML/PHP] iframe genereren, hoogte aanpassen aan inhoud? - Softwareontwikkeling

woensdag 14 maart 2007 17:58

Acties:

Verwijderd

Topicstarter

Hoi,

Op een bepaalde pagina kunnen gebruikers de html code voor een iframe genereren. Dit iframe verwijst naar een source pagina (php) die dynamisch op basis van meegestuurde parameters een html pagina genereert, zodat gebruikers (webmasters) deze dynamisch gegenereerde pagina op hun eigen site kunnn plaatsen door simpelweg het gegenereerde iframe in hun pagina te plakken.

Op zich is dit een mooie oplossing, maar ik zit met één probleem. Ik bereken aan de hand van de meegegeven parameters de hoogte die het iframe moet krijgen en geef deze dan aan het gegenereerde iframe mee. Dit werkt goed als ik alleen met plaatjes cellspacing en borders moet rekenen, want deze hebben altijd dezelfde grootte. In php (waarmee het iframe gegenereert wordt) tel ik simpelweg de hoogtes van de elementen op en dan heb ik de totale hoogte.
Er is echter ook een mogelijkheid voor de gebruikers om boven de plaatjes een koptekst te laten genereren. Hierbij kunnen ze het lettertype en de lettergrootte alsmede het font-weight instellen. Ik kan dus van de koptekst niet eenvoudigweg even de hoogte bepalen en deze bij de hoogte van de rest van de gegegeneerde html-pagina optellen. Hierdoor ontstaat de situatie dat het iframe te groot of te klein wordt. Ik wil echter graag dat de gegenereerde html-content precies in het iframe past.

Daarom vroeg ik me af of er een manier is om het iframe automatisch zo groot te laten worden als de content die het bevat.

Als iemand een oplossing heeft om wel de juiste hoogte van de gegenereerde content te bepalen (dus eigenlijk de hoogte van een variabele koptekst, de rest lukt me zelf) dan is dit natuurlijk ook prima!

Alvast bedankt!!

woensdag 14 maart 2007 18:16

Acties:

moozzuzz

evt. de gebruiker enkel de mogelijkheid bieden om lettertypes in één bepaalde grootte (in px) te kiezen (niet ideaal i know) of de lineheight in px vastzetten?

woensdag 14 maart 2007 19:07

Acties:

Verwijderd

Topicstarter

is een mogelijke oplossing, maar zoals je zegt niet meest ideaal, zijn er nog andere opties?

woensdag 14 maart 2007 19:27

Acties:

djexplo

Website met iframe:

HTML:

<html>
  <body>
      <iframe id="iframegroot" name="iframegroot" src="groot.htm"></iframe>
  </body>
</html>

Inhoud Iframe (groot.htm):

HTML:

<html>
  <body>
    <table id="myTable">
    <tr><td>

        testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest 
       <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
        testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest 
   
    </td></tr>
    </table>

  <script>
    window.parent.document.getElementById('iframegroot').height=document.getElementById( 'myTable' ).offsetHeight+30 ;
    window.parent.document.getElementById('iframegroot').width=document.getElementById( 'myTable' ).offsetWidth+30 ;
  </script>
  </body>
</html>

Methode werkt door de hoogte van de tabel (die automatisch resized naar zijn inhoud) in het iframe uit te lezen, en deze als nieuwe hoogte van het iframe op te geven ...

Deze auto overflow iframe oplossing is niet op internet te vinden, dus copyright djexplo

[ Voor 93% gewijzigd door djexplo op 14-03-2007 19:50 ]

'if it looks like a duck, walks like a duck and quacks like a duck it's probably a duck'

maandag 19 maart 2007 12:47

Acties:

Verwijderd

Topicstarter

bedankt voor de oplossing! hij lijkt inderdaad goed te werken, althans bij mij lokaal in mijn testomgeving. Als ik hem echter online test dan loop ik tegen een probleem aan. De JS code onderaan resulteert namelijk in een "toegang geweigerd" error, omdat de JS code vanuit het iframe probeert de eigenschappen van het iframe zelf (op parent niveau) te wijzigen. De oorzaak hiervan is dat het iframe zelf op een ander domein staat dan de pagina die erin geladen wordt. Is hier een oplossing voor?

maandag 19 maart 2007 13:15

Acties:

Verwijderd

Verwijderd schreef op maandag 19 maart 2007 @ 12:47:
Is hier een oplossing voor?

Gelukkig niet. Dat zou namelijk een XSS-risico met zich meebrengen.

maandag 19 maart 2007 13:31

Acties:

Verwijderd

Topicstarter

ja ik snap dat het vanuit het oogpunt van beveiliging fijn is dat het niet kan, maar is er een manier om wat ik wil toch werkend te krijgen?

maandag 19 maart 2007 13:39

Acties:

Janoz

Moderator Devschuur®

!litemod

Beide pagina's op hetzelfde domein zetten. Zou een leuke security zijn als je een 'security override' optie in je pagina kon zetten. Lijkt me niet de bedoeling dat de pagina bepaald wat de security is.

Ken Thompson's famous line from V6 UNIX is equaly applicable to this post:
'You are not expected to understand this'

woensdag 21 maart 2007 17:29

Acties:

Verwijderd

Topicstarter

ik snap dat het dus niet gaat door de security. Maar ik zou toch wel in principe het JS op de hoofdpagina kunnen laten uitvoeren? In dit geval wijzigt het javascript de afmetingen van het iframe dat op de pagina zelf staat. Het enige wat me daarbij niet lukt is om de offset height en width van de tabel binnen het iframa op te halen.

Ik snap echter niet hoe ik vanaf de hoofdpagina (waar het iframe in zit) de offsett hoogte van de tabel in het iframe kan ophalen.
Stel het iframe heet "mijniframe" en de tabel in het iframe heet "mijntabel". Ik dacht dat ik dan met de volgende code de juiste hoogte zou kunnen meegeven aan "mijniframe":

code:

1	document.getElementById('mijniframe').width=window.frames("mijniframe").document.getElementById('mijntabel').offsetWidth+30

Ook met deze opzet krijg ik echter nog een "toegang geweigerd" error. Dit vind ik gek want je zou toch zeggen dat een variabele uitlezen wel zou moeten mogen... Of is het ophalen van een waarde uit een iframe ook niet toegestaan? Dit lijkt me toch geen beveiligingslek?

woensdag 21 maart 2007 23:36

Acties:

Verwijderd

Verwijderd schreef op woensdag 21 maart 2007 @ 17:29:
ik snap dat het dus niet gaat door de security. Maar ik zou toch wel in principe het JS op de hoofdpagina kunnen laten uitvoeren? In dit geval wijzigt het javascript de afmetingen van het iframe dat op de pagina zelf staat. Het enige wat me daarbij niet lukt is om de offset height en width van de tabel binnen het iframa op te halen.

Je spreekt het document binnen de iframe aan, en wanneer dit niet op hetzelfde domein draait is dit simpelweg niet toegestaan. Of je nou wilt lezen of schrijven.

donderdag 22 maart 2007 15:05

Acties:

Verwijderd

Topicstarter

mmm, dan ziet het er haast naar uit dat ik de tekstopie geheel weg moet laten, omdat ik geen andere oplossing kan bedenken dan de (aangedragen) oplossing met JS...
wel jammer, of heeft iemand nog een ander idee om het op te lossen (zie eerste post topic voor het eigenlijke probleem)?