SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    document.style.height problems in FF

    if i put this:
    flash = document.getElementById('flashapp');
    flash.style.height = '650px';


    in my page it make my flash move 650px high in IE although it does not in FF

    i already made sure i gave the right tag the id="" and name="" for firefox to see it and i tested to see if FF saw flash as and it return [htmlObject]

    also if i set the height to 100% it does not make it 100% but just makes it about 200px hight (very short)

    i am trying to make my flash file 100% tall and no shorter than 650px i have this function that works fine in IE but FF is killing me..

    Code:
    window.onresize = flashSize;
    document.onresize = flashSize;
    function flashSize() {
    	flash = document.getElementById('flashapp');
    	if(getDocSize('h')<650){
    		flash.style.height = '650px';
    	}else{
    		flash.style.height = '100%';
    	}
    }
    also i get the window hieght from this function:
    Code:
    function getDocSize(who) {
      var myHeight = 0; myWidth = 0;
      if( typeof( window.innerWidth ) == 'number' ) {
        //Non-IE
        myWidth = window.innerWidth;
        myHeight = window.innerHeight;
      } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
        //IE 6+ in 'standards compliant mode'
        myWidth = document.documentElement.clientWidth;
        myHeight = document.documentElement.clientHeight;
      } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
        //IE 4 compatible
        myWidth = document.body.clientWidth;
        myHeight = document.body.clientHeight;
      }
      if(who == 'h' ||  who == 'height'){
      	return myHeight;
      }else if(who == 'w' ||  who == 'width'){
      	return myWidth;
      }
    }

    anyone have any clues how to handle this in FF??

    thanks
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.

  2. #2
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You have any url to test this? You get any errors in the JavaScript console?

  3. #3
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeah its http://altoonadesign.com

    and no errors
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.

  4. #4
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is due to that the variable flash is never set by some reason, try alerting it and you will get null.

    There for null.style.height will fail

  5. #5
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pepejeria
    This is due to that the variable flash is never set by some reason, try alerting it and you will get null.

    There for null.style.height will fail

    i already stated that in my first post that i already alerted the variable flash and it returns [object htmlobjectelement] so it does get set.
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.

  6. #6
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ah yeah, sorry, had the flash blocker on...

    Anyway, using the DOM Inspector in Firefox I see that the Object tag gets the height 100% set, no the embed. IE uses the object tag and firefox the embed, so you need to set the embed to height 100% as well

  7. #7
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pepejeria
    Ah yeah, sorry, had the flash blocker on...

    Anyway, using the DOM Inspector in Firefox I see that the Object tag gets the height 100% set, no the embed. IE uses the object tag and firefox the embed, so you need to set the embed to height 100% as well

    ok so in my object tag i have <object id="flashapp"
    and in my embed tag i have <embed name="flashapp"

    the the function has
    flash = document.getElementById('flashapp');
    flash.style.height = '100%';

    would i need to add an id to the embed (im not sure it it will be good to have 2 id's the same) OR have something like getElementByName('flashapp') im not sure if thats even valid??

    sorry im much more an actionsripter than a javascripter, how would i make sure the embed gets the hieght 100%?

    thanks!!
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.

  8. #8
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ids are unique, so you cant have the same id set on two elements, try this:
    Code:
    HTML:
    <object id="flashObject"
    <embed id="flashEmbed"
    
    JS:
    
    var oFlash = document.getElementById("flashObject") || document.getElementById("flashEmbed");
    Whats left to the || will be null in Firefox, so it will try whats to the right, meaning taht both IE and Firefox will have the oFlash set to either the object or embed tag

  9. #9
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks man!...i dont have a big enough screen to test it until monday ill let ya know how ot goes...thanks
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.

  10. #10
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok i got it to work so it is changing in firefox accordingly however when it changes the height to 100% in FF it doesnt go to 100% instead it jumps to like 200px
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.

  11. #11
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok if i add this:
    Code:
    html {
      height: 100%;
    }
    
    body {
    	margin-left: 0px;
    	margin-top: 0px;
    	margin-right: 0px;
    	margin-bottom: 0px;
    	height: 100%;
    }
    and put the flash inside a div and set it to 100% also then flash will go to 100% in FF... but now in IE i get about a half inch gap between the bottom of the flash file and the bottom of the page but i have my margin set to 0 ...anyone know why?

    and does anyone know how to change the body height and html height via javascript??

    Thanks!
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •