TP-Docs
HTML5 Icon HTML5 Icon HTML5 Icon
TP on Social Media

Recent

User

Welcome to TinyPortal. Please login or sign up.

May 17, 2024, 07:29:38 AM

Login with username, password and session length

Stats

Members
  • Total Members: 3,886
  • Latest: Grendor
Stats
  • Total Posts: 195,189
  • Total Topics: 21,220
  • Online today: 59
  • Online ever: 3,540 (September 03, 2022, 01:38:54 AM)
Users Online
  • Users: 0
  • Guests: 36
  • Total: 36

100% Height Iframe

Started by Lord Anubis, January 17, 2008, 01:06:22 AM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

Print
Go Down Pages1 2 All
User actions

Lord Anubis

January 17, 2008, 01:06:22 AM Last Edit: February 07, 2008, 03:04:22 AM by Lord Anubis
Have you ever had problems creating an Iframe with 100% height?

Well using the code:

<iframe width=100% height=100%></iframe>

DOES NOT WORK WITH MOST BROWSERS, so here is a simple solution for SMF forums...

WARNING: Whenever editing code, be sure to make a backup so you can restore it if anything goes wrong!!!

In the index.template.php for YOUR THEME find:

</head>

Add before

Code Select

<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>


Then create a TP article (or custom action) and insert this code (into the source):

Code Select
<iframe width="100%" scrolling="no" onload="resize_iframe()" id="glu" src="http://your-iframe-source.php"> </iframe>

CHANGE
Code Select
http://your-iframe-source.php to the location of your Iframe


Hope this helps  ;)

noxe

#1
January 28, 2008, 06:13:36 AM
Omg thank you, I needed this badly!

Smoky

#2
January 28, 2008, 07:24:31 AM
nice, m'lord, thanks!!  :D

falguni1

#3
January 28, 2008, 02:57:26 PM
I will try this.

falguni1

#4
January 28, 2008, 03:07:11 PM
it says

The file you tried to save generated the following error:
Parse error: syntax error, unexpected T_STRING, expecting ',' or ';' in index.template.php on line 117

tick

#5
January 28, 2008, 03:23:02 PM
attach your index template here and we can look at why you are getting that error

Hairy

#6
February 05, 2008, 09:50:02 AM Last Edit: February 05, 2008, 09:56:34 AM by Hairy
I get the error also, file is attached.

Lord Anubis

#7
February 05, 2008, 01:49:17 PM Last Edit: February 05, 2008, 01:53:22 PM by Lord Anubis
What editor were you using Hairy, I ask because your head tag was in the wrong spot

I think I fixed it, give this a try  ;)

Gargoyle

#8
February 06, 2008, 11:58:26 PM
I tried to integrate this all onto one page with no luck. My coppermine currently loads in an SMF page to keep the overall look of the site. I like the concept of your idea. Just haven't successfully implemented it yet.

Looks like some good work there and very helpful

Hairy

#9
February 07, 2008, 12:59:40 AM
Quote from: Lord Anubis on February 05, 2008, 01:49:17 PM
What editor were you using Hairy, I ask because your head tag was in the wrong spot

I think I fixed it, give this a try  ;)



I use Notepad++ but I don't know what was used by the original theme author.

I just tested the new index.template.php but it gives me the following error:

Code Select
Template Parse Error!
There was a problem loading the /Themes/Pirates-SAMS/index.template.php template or language file. Please check the syntax and try again - remember, single quotes (') often have to be escaped with a slash (\). To see more specific error information from PHP, try accessing the file directly.

You may want to try to refresh this page or use the default theme.
--------------------------------------------------------------------------------


Parse error: syntax error, unexpected T_FUNCTION in .../Themes/Pirates-SAMS/index.template.php on line 30

21:
22: The menu sub template should display all the relevant buttons the user
23: wants and or needs.
24:
25: For more information on the templating system, please see the site at:
26: http://www.simplemachines.org/
27: */
28:
29: // Initialize the template... mainly little settings.
30: function template_init()31: {
32: global $context, $settings, $options, $txt;
33:
34: /* Use images from default theme when using templates from the default theme?

Lord Anubis

#10
February 07, 2008, 01:04:07 AM
Can you post your original untouched index.template.php and I will add the code for ya ;)

Hairy

#11
February 07, 2008, 01:20:36 AM
Here is the one currently being used, it's not the original because I changed a few little things to suit my current theme, I didn't touch <head> tags  :-\

*added arcade button
*changed image names to show my new images
*some footer changes for copyright/images

Cheers

Hairy

#12
February 07, 2008, 01:23:14 AM
That's strange, last attachment is larger then the previous  :o

Lord Anubis

#13
February 07, 2008, 03:06:12 AM
Okay I figured out my mistake on the code (didn't need to use echo in the code between the head tags :uglystupid2: )

Here is a fixed copy with the Iframe intact, give the iframe code I posted a try and let me know if it does it correctly ;)

Hairy

#14
February 07, 2008, 11:58:17 AM
Thanks for that, no errors and I now see how it works.

Is there anyway of getting it to resize when the page inside the IFrame changes size instead/also when you resize your own browser?

To see what I mean check this out http://www.samclan.com/index.php?page=60

This IFrame is for someone to put in a gameserver IP and then it loads pictures within the IFrame from that gameserver.

But it doesn't resize by itself, I need to keep resizing my browser to be able to see the new pictures loaded since last resize.

Put our gameserver IP (8.3.7.120) in there and you can see what I mean (there is ~500 pictures that will eventually load)

Cheers
Hairy  :up:


PS. here's the one we currently use http://www.samclan.com/index.php?page=59 but I was hoping to get rid of the scrollbar for the IFrame  ^-^

Lord Anubis

#15
February 07, 2008, 04:32:46 PM
If you could automatically have your game servers IP in there I think it would auto resize to all to the content, but I have yet to get this to resize it dynamically to content that isn't there on the initial page load...I am sure there might be a way, but I haven't figured that yet :'(

Ken.

#16
February 07, 2008, 05:21:08 PM
LA, have you looked at whats available on DynamicDrive to see if any of their code will help you?

There are several threads here on TP where their code has worked well for auto-resizing iframes for the Coppermine gallery and other things.

Heres one example of the DD iframe code:
http://www.dynamicdrive.com/dynamicindex17/dowiframe.htm
" If everything seems under control, you're not going fast enough." - Mario Andretti
Yesterday When I was Young.

Lord Anubis

#17
February 07, 2008, 05:29:17 PM
Hmmm, I might have to mess with that :up:

Hairy

#18
February 07, 2008, 09:48:38 PM
Quote from: Lord Anubis on February 07, 2008, 04:32:46 PM
If you could automatically have your game servers IP in there I think it would auto resize to all to the content, but I have yet to get this to resize it dynamically to content that isn't there on the initial page load...I am sure there might be a way, but I haven't figured that yet :'(

The site I'm linking to is provided externally by our anti-cheat friends so I don't know how I can get the IP to load by itself, also if it was mainly for our server I could just set a size that would cover our pics, other servers can have several thousand pics instead so that wouldn't be good.

Good luck  8)
Print
Go Up Pages1 2 All
User actions