AlexC Posted June 2, 2013 Share Posted June 2, 2013 I am using <iframe> to create a scrollable area in the remaining space in a window. I have a small java script to calculate the size of the frame and that works fine. If I resize the window and then force a refresh everything works no problem. To avoid confusion for the user by having two scroll bars if the window is resized I then thought of using the onresizeend event to trigger a script to do the reload. So far no success. The function I have created is, function resizeframe {document.location.reload("true");} I don't know whether the function is wrong or I have not placed the trigger in the correct place. I have tried the trigger on the <div> for the <iframe> creation and then successively higher until placing in the <body> - all with no result. I have also tried adding a 'contenteditable' attribute to the <iframe> <div> with no result. Any pointers would be appreciated. Link to comment Share on other sites More sharing options...
jeffman Posted June 2, 2013 Share Posted June 2, 2013 Don't forget the parentheses when defining a function: function resizeframe () { // etc But I really don't recommend this strategy. A resize event might get fired before your user releases the mouse button, and that would cause really annoying behavior. Depending on the way your function works that initially sizes the frame, you might want to execute that when the resize event fires. Link to comment Share on other sites More sharing options...
AlexC Posted June 7, 2013 Author Share Posted June 7, 2013 Thanks for the reply - been out for a few days, hence the delay in trying it. However parentheses have not made a difference. I also imported the relevant lines of one of the W3Schools' code examples for resizing into my page, as below, but that doesn't produce any results either, so there must be something basic I'm missing. I'm currently in IE10 on Windows 8, but I've also tried it in Firefox and Chrome. <!DOCTYPE html><html><head><script>function showMsg(){alert("You have changed the size of the browser window!");}</script></head><body onresize="showMsg()"><p>Try to resize the browser window.</p></body></html> Link to comment Share on other sites More sharing options...
jeffman Posted June 7, 2013 Share Posted June 7, 2013 It works for me in FF, but the alert creates really annoying behavior. It might be the source of your problem. Also, my inclination is to attach the event handler to the window, not the body. Try experimenting with this. <!DOCTYPE html> <html> <head> <script> function showMsg() { document.getElementById("mytxt").innerHTML = window.innerHeight; } window.onresize = showMsg; </script> </head> <body> <p id="mytxt"></p> </body></html> Note that innerHeight is not available to IE before version 9. It sounds like you have code that handles that. Link to comment Share on other sites More sharing options...
AlexC Posted June 9, 2013 Author Share Posted June 9, 2013 Many thanks for your help. I'm now getting a response to the resize event, although a resizeend event doesn't seem to work but that isn't a serious limitation. However I'm not getting the overall result I wanted, but I think I know why - I need to significantly extend my scripting but having just started on scripting, PHP, CSS, etc. I need to get more familiar with all those I think before returning to this. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now