[DYNIFS]
Goto page 1, 2  Next
 
Post new topic   Reply to topic   printer-friendly view    phpMiX.org Forum Index -> Widgets Discussion -> Javascript Snippets
View previous topic :: View next topic  
Author Message
RicoBlues
Apprentice
Apprentice


Joined: 07 Nov 2006
Posts: 10
Location: Italy

PostPosted: Tue Nov 07, 2006 10:17 am    Post subject: [DYNIFS] Reply with quote

Hi,

after installing the js file, and followed all the online instructions, I've applied the mod for the Mac world as on the post. After I've tested on every browser I've on my Mac's (Safari 2, Firefox 2, Opera 9 under Tiger and early version under Panther) each with different rendering engine and all works fine. When testing under IE6 (Virtual PC and on a Windows machine with XPprofessional) the content of the iframe is loaded or refreshed continuosly. I don't know.

At the end of the js file I've remove the mod restoring the original code:
if I use this Safari 2 and Opera 9, don't reduce the page but at every change of page it grows the iFrame. IE 6 and Firefox 2 works right.

Code:
      if( document.all ) div.style.height = '0px';
      // Resize the IFrame container
      var dim = this.getDim(iframe.document);
      div.style.height = (dim[1]+70) + 'px';


using this mod

Code:
      div.style.height = '0px';
      // Resize the IFrame container.
      // Use a slight delay, so getDim can get the correct dimensions.
      setTimeout('var dim = DYNIFS.getDim(window.frames[\''+id+'\'].document);  document.getElementById(\''+id+'\').style.height = (dim[1]+70) + \'px\';', 1);


Safari 2, Opera 9 and Firefox 2 works well. IE6 refresh continuosly the content of the iFrame.
I've tried different values of the timeout function, but the problem remains.

Any suggestions? Thank You. Rico.

 
 
_________________
RicoBlues
 
Back to top
View user's profile Send private message Visit poster's website
RicoBlues
Apprentice
Apprentice


Joined: 07 Nov 2006
Posts: 10
Location: Italy

PostPosted: Thu Nov 09, 2006 10:00 am    Post subject: I've found a solution Reply with quote

Hi,

after a couple of days, I've found a solution, checking the browser and using the right code.

I've sobstitute this code at the end of DYNIFS.js

Code:
      div.style.height = '0px';
      // Resize the IFrame container.
      // Use a slight delay, so getDim can get the correct dimensions.
      setTimeout('var dim = DYNIFS.getDim(window.frames[\''+id+'\'].document);  document.getElementById(\''+id+'\').style.height = (dim[1]+70) + \'px\';', 1);



with this

Code:
        if (navigator.userAgent.toLowerCase().indexOf('msie') + 1) {
           // this work for IE
          var dim = this.getDim(iframe.document);
          div.style.height = (dim[1]+70) + 'px';
        } else {
           // this works for Safari, Opera, Firefox (3 differente engines)
          div.style.height = '0px';
          setTimeout('var dim = DYNIFS.getDim(window.frames[\''+id+'\'].document); document.getElementById(\''+id+'\').style.height = (dim[1]+70) + \'px\';', 1);      
        }


The pages now looks right.

Any opinion will be appreciated. Best Regards, rico.

 
 
_________________
RicoBlues
 
Back to top
View user's profile Send private message Visit poster's website
will2412
Starter
Starter


Joined: 13 Nov 2006
Posts: 2

PostPosted: Mon Nov 13, 2006 6:49 pm    Post subject: Height not changing Reply with quote

Rico
Your solution solved the IE6 & IE7 refreshing but now the height of the Iframe remains at 200 px so the height it is not dynamically changing
Any idea?
 
Back to top
View user's profile Send private message Yahoo Messenger
RicoBlues
Apprentice
Apprentice


Joined: 07 Nov 2006
Posts: 10
Location: Italy

PostPosted: Mon Nov 13, 2006 7:24 pm    Post subject: Don't resize? Reply with quote

Hi Will,

I don't understand you problem. I've tested this solution with a lot of browsers and the height of the frame is correct for every page loaded.
Tested with: Safari 2.0, Firefox 2.0, Opera 9.1, Netscape 7.2, OmniWeb 5.5 under Mac Osx and IE6 under win2000 without problems.

This is the link of my website (sorry is only in itaian) : http://www.rico5.com/

The following code may help you. Is part of my website index css and html code.

Let me know. Rico.

Code:
/* div class as id of the iframe container */
#middle {
   position: static;
   margin: -7px 185px 10px 185px;
   padding: 10px 10px 10px 5px;
   height: auto;
   border: 2px solid #FFFFFF;
   background-color: #E0E0E0;
   text-align: justify;
   overflow: auto;   
   }



Code:
/* iframe class */
.framestyle {
   position: static;
   margin: 0px 0px 0px 5px;
   padding 0px;
    /* width: 515px; */
    width: 98%;   
   border: 2px solid white;
   overflow: hidden;
   }


Code:
<iframe width="98%" height="500"
   id="myFrame" name="myFrame"
   src="mybloggie214/index.php"
   onload="setTimeout('DYNIFS.resize(\'myFrame\');', 100)"
   scrolling="no"
   frameborder="0"
   class="framestyle"></iframe>

 
 
_________________
RicoBlues
 
Back to top
View user's profile Send private message Visit poster's website
cm
Apprentice
Apprentice


Joined: 19 Dec 2006
Posts: 7
Location: UK

PostPosted: Tue Dec 19, 2006 8:39 pm    Post subject: Reply with quote

Hi,

I have been struggling with auto resizing iframes for some time. I started with the Dynamic Drive IFrame SSI script II, but couldn't get it to work with Netscape 7.2 (my preferred browser) and then found this DYNIFS script.

After using some of Rico's changes... thank you Rico... it was/is working perfectly in Netscape 7.2, IE 6 and Firefox 1.0. However, i know the end product is going to be used on a Mac, so i found and used the rest of Rico's changes for Safari etc. This broke my styling in Netscape 7.2, but i solved it by including Netscape in the check browser code with IE.

I don't own a Mac or have access to one, so as the comments in the new code said it worked in Opera, i tried it in version 7.0 on my PC but it failed miserably.

Is this just an Opera V.7 on a PC thing, or does it mean i have included the replacement code incorectly. I viewed Rico's website in the same browser and that failed to resize as well.

Would anyone (Rico?) possibly be able to view my 'prototype design' on a Mac and PC if i put up the URL in this forum?

Please note that because i have been a web designer since 1995, i am a table nut and love them, however, i know i have to move with the times and this is my first attempt at a CSS/Div layout!

Thanks, CM
 
Back to top
View user's profile Send private message Visit poster's website
RicoBlues
Apprentice
Apprentice


Joined: 07 Nov 2006
Posts: 10
Location: Italy

PostPosted: Wed Dec 20, 2006 10:08 am    Post subject: I hope to help you Reply with quote

Hi Cm,

post your web site address, I give it a look.

Merry Christmas & Happy New Year, Rico.

 
 
_________________
RicoBlues
 
Back to top
View user's profile Send private message Visit poster's website
cm
Apprentice
Apprentice


Joined: 19 Dec 2006
Posts: 7
Location: UK

PostPosted: Wed Dec 20, 2006 7:54 pm    Post subject: Reply with quote

Hi Rico,

Many thanks for helping me with this! Here are the 2 versions (URL's), the first is for the PC and the second, which includes your code for the Mac and has my slight change of adding Netscape to the browser check for msie.

The Mac URL starts with a different page, because this is a longer page and i wanted to test that it down sized as well as up sized from the initial load. It doesn't in Netscape 7.2. unless you use the browser refresh button once the shorter IFRAME page has loaded?

Please note that the only links that function are 'home' at the top and bottom of the page and the internal IFRAME page links.

http://www.lankesterdesigns.biz/autoresize/index_test_3.htm (PC)
http://www.lankesterdesigns.biz/autoresize/index_test_3a_4mac.htm (Mac)

Wishing you a very happy Christmas too!
CM.
 
Back to top
View user's profile Send private message Visit poster's website
RicoBlues
Apprentice
Apprentice


Joined: 07 Nov 2006
Posts: 10
Location: Italy

PostPosted: Wed Dec 20, 2006 9:16 pm    Post subject: Links Tested Reply with quote

Hi CM,

I've made a test on this browsers on my Mac:
Safari 2.0.4 / Netscape 7.2 / OmniWeb 5.51 / Opera 9.0 / Firefox 2.0

All works fine except:
1. Netscape 7.2 as you've described.
2. All browser have on MacPage, extra space at end of page (about 3/4 lines)
3. Opera problem on WinPage


Is strange the Netscae problem, why have you added a control on Netscape as msie ?

Let me know. Rico.

 
 
_________________
RicoBlues
 
Back to top
View user's profile Send private message Visit poster's website
cm
Apprentice
Apprentice


Joined: 19 Dec 2006
Posts: 7
Location: UK

PostPosted: Wed Dec 20, 2006 10:03 pm    Post subject: Reply with quote

Hi Rico,

Thank you very much for such prompt action!

Can i ask what WinPage is please?

The reason for adding Netscape to the browser detect part of the script was because when i added the Mac coding, it messed up my CSS styles in Netscape 7.2 on the PC. It was overlaying the background image in the 'container' Div with the BODY background colour. I found this out by taking a screen capture and measuring the width, margin-top and margin-left of the yellow area, which had rendered above the background image. The number of pixels exactly matched the amounts defined in the IFRAME 'content' Div. I also tried z-index, but although i thought this should have worked, it didn't.

I messed around for hours (far too many) trying to fix the CSS style for 'content', but could find no solution. I started to realise that the styling wasn't the problem and as it was working ok before the coding change for the Mac, i decided to exclude it from the additional coding by putting it in with msie.

Not many people use Netscape 7.2 on a Mac, so i would rather it worked ok on a PC with this browser, but it is a bonus that it still works ok on a Mac.

I have had a report, from someone else with a Mac, that in Safari (version unknown) the 2 right hand text boxes are too long/wide? and should be fixed to 120 pixels wide, but as they are only 126 now plus padding and borders etc., it seems a shame to ruin it for all the other browsers. I don't know the person well enough to talk to about this and it was just a chance comment to a work colleague that i got this test done in the first place. As it was done in this person's company time, i do not want to trouble him again, but did you have the same experience using Safari?

If you ever find a way to avoid the need for a browser refresh after the IFRAME is loaded with a smaller page in Netscape, please let me know.

As you can see, even my kitten was working hard on the problem (see avatar!), but i think he is a little more intelligent than me Confused

Thank you so much for your help, it is very much appreciated. I could never have achieved this much without your original postings!

CM.
 
Back to top
View user's profile Send private message Visit poster's website
RicoBlues
Apprentice
Apprentice


Joined: 07 Nov 2006
Posts: 10
Location: Italy

PostPosted: Thu Dec 21, 2006 10:53 am    Post subject: Little mistake Reply with quote

Hi CM.

the half WinPage was on OmniWeb 5.5 and not Opera 9.0 - OmniWeb is a commercial web browser under Mac Osx, and is the page associated with the link.
Netscape has the same render engine of Firefox and this is a strange behaviour. Under Mac (I've tested it again) the frame heigth grows every time I click the link but it isn't a big problems becouse under MacOsx lot of people uses Safari or Firefox, only few the other browsers (Opera, OmniWeb, and Netscape or Yellowcab)

This are some links of Css sites where I go when in panic. The poor support to Css by many browser is really a big problem.

Css tests and experiments
Css Links
Css Vault

I've found a small problem in Safari in your pages: is the width of the text box in login. They go near (or out) of the right margin of the yellow box.
The same with OmniWeb (they have the same render engine).

Try to use em to set the size of the text box or some other way or hack.

Have a nice day, Rico.

 
 
_________________
RicoBlues
 
Back to top
View user's profile Send private message Visit poster's website
cm
Apprentice
Apprentice


Joined: 19 Dec 2006
Posts: 7
Location: UK

PostPosted: Thu Dec 21, 2006 1:29 pm    Post subject: Reply with quote

Hi Rico,

The textbox error could be caused by one of 2 things. I had the textbox 'size' attribute set to 18, so that it was the same size as the login image below. Otherwise, it could be because i have a style applied to the textbox for the font that is entered (e.g. font-face, font-size, etc.).

I have now reduced the textbox 'size' attribute to 15, to see if this is the problem, If this does not fix it, then maybe i should remove the style, but i do not like the look of textboxes in their natural 'Windows' form.

If this works, i will either centralise the contents of the login box or make the login button smaller, because i think the difference in sizing between the 2 elements (textboxes and image) looks very untidy... or am i just too fussy!

Let me know if this change has worked, if not i will remove the associated style. I have only changed the second URL (ending... 4mac.htm) file.

Also, i have not worked with 'em' before and would like to find a website that gives a way of comparing pixel or point size to em size and how to use it appropriately. I have tried using it, but my text always looks too big, no matter how low the em number? Can you recommend a beginners site on this topic... remember this is my first attempt at a CSS/Div layout.

Many thanks,
CM.
 
Back to top
View user's profile Send private message Visit poster's website
RicoBlues
Apprentice
Apprentice


Joined: 07 Nov 2006
Posts: 10
Location: Italy

PostPosted: Fri Dec 22, 2006 8:04 am    Post subject: Input box Ok Reply with quote

Hi CM,

now, for the macpage, the input box are correct in Safari and OmniWeb. Good job.

Em sizing are a little difficult (for me) to assimilate. I've found a page
Clagnut
that explain use of fonts and em in web pages. It's very intersting and a great source.

Have a nice day, Rico.

 
 
_________________
RicoBlues
 
Back to top
View user's profile Send private message Visit poster's website
cm
Apprentice
Apprentice


Joined: 19 Dec 2006
Posts: 7
Location: UK

PostPosted: Fri Dec 22, 2006 1:48 pm    Post subject: Reply with quote

Hi Rico,

Thank you, this is very good news! I can now relax and enjoy the Christmas break, knowing that when i come to populate the 'real' site with the IFRAME data, the main page static layout will be looking fine for the Mac.

No doubt we will speak again and once more, many thanks for your time and help!

CM.
 
Back to top
View user's profile Send private message Visit poster's website
RicoBlues
Apprentice
Apprentice


Joined: 07 Nov 2006
Posts: 10
Location: Italy

PostPosted: Fri Dec 22, 2006 3:18 pm    Post subject: Stay happy Reply with quote

I'm happy,

I believe we live to be better and to grow. Only speaking and sharing we can do this.

Have a Merry Christmas. Rico.

 
 
_________________
RicoBlues
 
Back to top
View user's profile Send private message Visit poster's website
mikeyj
Apprentice
Apprentice


Joined: 19 Feb 2007
Posts: 7

PostPosted: Mon Feb 19, 2007 8:39 pm    Post subject: Reply with quote

Hi All,

I seem to be having the same issue that Will had. The code provided by Rico fixes the IE refresh problem but now the iframes are not resizing. I've implemented the exact code specified by Rico for Iframe wrapper, iframe, etc with no results. Any thoughts?

Thx,
Mike
 
Back to top
View user's profile Send private message
Display posts from previous:   
Post new topic   Reply to topic   printer-friendly view    phpMiX.org Forum Index -> Widgets Discussion -> Javascript Snippets All times are GMT + 1 Hour
Goto page 1, 2  Next
Page 1 of 2


 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
You cannot attach files in this forum
You can download files in this forum