Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Nov 2004
    Location
    near the only active volcano in the continental US
    Posts
    409
    Thanks
    6
    Thanked 2 Times in 2 Posts

    Question Image and Table Attributes Help Needed

    The script I am working on right now already has a floating menu of sorts that rides along the left side of the page when the visitor scrolls up or down. What I am trying to do now is adjust a table that fills the rest of the page based on the browser window width. I want the table to fill up the rest of the space from left to right which I dont think I will have a problem doing. However, I have background images for the data cells and want to be able to adjust the width and height of them according to the width of the table (keeping them proportional). If I create a universal reference to the images, the table and its cells, is it possible to define the width and height of each based on the size of the browser window? I think the code would appear something like this. . .

    var tableobj=document.all? document.all.storyboard : document.getElementById? document.getElementById("storyboard") : document.storyboard //storyboard being the name of the table in general

    var sbtopobj=document.all? document.all.sbtopcell : document.getElementById? document.getElementById("sbtopcell") : document.sbtopcell //sbtopcell being the name of the uppermost cell of the table

    var sbtopimg=document.all? document.all.pagetop : document.getElementById? document.getElementById("pagetop") : document.pagetop //pagetop being the name of the image in question

    var window_width=document.all? document.body.clientWidth : window.innerWidth //gets browser window width

    tableobj.width=parseInt(window_width)-260 //defines the width of an established table

    sbtopobj.height=Math.floor(imageheight*((parseInt(window_width)-260)/imagewidth)) //defines the height of the cell in the cell tag as a proportional value of the table width versus the image width

    sbtopimg.height=Math.floor(imageheight*((parseInt(window_width)-260)/imagewidth)) //same as above except defines the height of the image in the image tag

    sbtopimg.width=Math.floor(imagewidth*((parsInt(window_width)-260)/imagewidth)) //defines the width of the image in the image tag

    All of this assumes I have defined imagewidth and imageheight as set variables. I know this is only a sampling of the code, and I am pretty sure I have it right, however, I wanted to check with some of you that are more in the know about this stuff than I am before getting too deep into the coding. My real concern is whether or not it is even valid to do this sort of thing or if it will send the browser window into a fit. I am also concerned with the problems of resizing the window at some point, but am not quite ready for that. If anyone has any suggestions, I am wide open for them. This is the first really indepth script I have worked on and I would really like to get it running smoothly in a crossbrowser fashion.

  • #2
    Regular Coder
    Join Date
    Nov 2004
    Location
    near the only active volcano in the continental US
    Posts
    409
    Thanks
    6
    Thanked 2 Times in 2 Posts
    Ack! Nevermind this thread, it just dawned on me that I can assign width or height attributes to a background image so I will have to come up with another workaround for this problem. Unless anyone knows how to assign such attributes to a background image.

    Thanks Anyways.

  • #3
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    ASFAIK, background image is not an object, it is an attribute's value (background if HTML or url(someimage) if backgroundImage CSS on-the-fly) thus it can not have other further attributes (other say: values can not have their values) as height or width.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

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