PDA

Click to See Complete Forum and Search --> : Shrinkable cell

thisObject
06-17-2005, 09:43 PM
How can I create a cell in a table which shrinks when browser window is (to smaller size)resized? For example, I have an image which width is 100px. When window is resized (to smaller size) only part of the image is visible not 100px in width but 50 px (for example). The image is not jammed but only part of it is visible. How can I achieve this?
Thanks guys.
BonRouge
06-17-2005, 11:50 PM
Put it in the background.

Even better, get rid of the table. It's difficult to give the best advice for your page as I haven't seen it, but you're obviously using tables for layout rather than for tabular data. Stop it.
thisObject
06-18-2005, 03:17 AM
what is tabular data?
BonRouge
06-18-2005, 04:19 AM
what is tabular data?
That's stuff like schedules (http://www.theschedule.com/), sports stats (http://stats.football365.com/dom/ENG/teams/Liverpool.html) and share prices (http://www.asx.com.au/asx/research/CompanyInfoSearchResults.jsp?searchBy=asxCode&allinfo=on&asxCode=uni#closing-prices) - usually things where you might visibly see a table that has headings for each column and the first item on each row is the subject of the row (I think you know what I mean).
thisObject
06-18-2005, 11:55 AM
######### **************************** #########
######### **************************** #########
######### **************************** #########
##TEXT### **IMG*********************** ##TEXT###
######### **************************** #########
######### **************************** #########
######### **************************** #########
######### **************************** #########

Here is exactly what I have.
When I resize the browser window the imgage stays the same but I can't see
the text on the right side I need to have the following when the window is resized

######### ******* #########
######### ******* #########
######### ******* #########
##TEXT### **IMG** ##TEXT###
######### ******* #########
######### ******* #########
######### ******* #########
######### ******* #########

So, some part of the image is not visible.

How can I do that? Thank you.
BonRouge
06-18-2005, 11:57 AM
Put it in the background.

Can you show me your page (a link)?
griff777
06-18-2005, 05:21 PM
Just did that this morning...

This is the JAVASCRIPT part of the code... The PHP script (not shown) creates the required ID tags for this to work...


<body class="s" onLoad="resize()">

<script type="text/javascript">


var IE4 = (document.all) ? 1 : 0;
function setObj_wh(obj_,w,h){
with(document){
if(typeof obj_ == "string"){
if(w > 0) getElementById(obj_).style.width = w;
if(h > 0) getElementById(obj_).style.height = h;
}else{
if(w > 0) obj_.style.width = w;
if(h > 0) obj_.style.height = h;
}
}
}

function resize(){
with(document){
var tNum = '';
var mDate = new Date();
var mday = mDate.getDate() ;
var cColumns = 8.0;
var hMult = (IE4) ? 0.11 : 0.095;
var wMult = ((98.0 / cColumns) / 100.0) ;
var w_ = Math.round(body.clientWidth * wMult);
var h_ = Math.round(body.clientHeight * hMult);
for(var i=1; i<= 31; i++){
tNum = '' + parseInt(i);
if(i <= mday){
if(i <= 9) tNum = '0' + tNum;
tObj = 'pic'+tNum;
setObj_wh(tObj, w_,0);
}
}
}
}
window.onresize = function() { resize() };


</script>



Not perfect, but functional.

an example ( a bit racey... so beware ) is the following link:
http://jdgsoftco.no-ip.com/stare.php
thisObject
06-21-2005, 01:31 AM
background thingy worked! Thanks a lot to all of you!!!