what's with this image?

**khaled450** · 11-10-2007, 07:28 AM

Code:

<html>
<head>
<title>Example</title>
<script type="text/javascript">
function size()
{
var a = document.getElementById('img').style.width;
var b = document.getElementById('img').style.height;
if(a != 150){
	document.getElementById('img').style.width = 150;
	document.getElementById('img').style.height = 200;
}else{
	document.getElementById('img').style.width = 300;
	document.getElementById('img').style.height = 500;
	}
	return false;
	
}
</script>
</head>
<body>

<img id="img" style="width:300px; height:500px; cursor:pointer" onClick="size()"src="zoro15.jpg" alt=""
 />
</body>
</html>

why isn't it resizing back to normal?

**jscheuer1** · 11-10-2007, 07:39 AM

a will never = 150 in a browser that complies to standards. The style width property is a string that includes the type of units being used, not a raw number as you are trying to make it be. If you try to assign it as just a number, many browsers will refuse to, others may append 'px' to it. Either way, it will never equal 150.

There could be other problems.

**khaled450** · 11-10-2007, 11:13 AM

is there a better way around this?

**jscheuer1** · 11-10-2007, 04:15 PM

Originally Posted by khaled450

is there a better way around this?

Well, the main thing is that you need to take into account the facts I mentioned. And, yes there is a better way, any way that worked would be better. There are, in fact 'many ways to skin a cat.' Here's one:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function size(el){
var s = el.style, w = 'width', h = 'height';
	if(s[w] != '150px'){
		s[w] = '150px';
		s[h] = '200px';
	}
	else {
		s[w] = '300px';
		s[h] = '500px';
	}
};
</script>
</head>
<body>
<div>
<img style="width:300px; height:500px; cursor:pointer;"
onclick="size(this)" src="zoro15.jpg" alt="">
</div>
</body>
</html>

**Kenny** · 11-10-2007, 08:15 PM

I've always had trouble with the 'px' deal. Here's what I whipped up from the original code...

PHP Code:


<html>

<head>

<title>Example</title>

<script type="text/javascript">

function size()

{

var a = document.getElementById('img').offsetWidth;

var b = document.getElementById('img').offsetHeight;

if(a != 150){

    document.getElementById('img').style.width = '150px';

    document.getElementById('img').style.height = '200px';

}else{

    document.getElementById('img').style.width = '300px';

    document.getElementById('img').style.height = '500px';

    }

    return false;

    

}

</script>

</head>

<body>



<img id="img" style="width:300px; height:500px; cursor:pointer" onClick="size()"src="zoro15.jpg" alt=""

 />

</body>

</html>

**jscheuer1** · 11-11-2007, 04:50 AM

Originally Posted by jscheuer1

There are, in fact 'many ways to skin a cat.' Here's one . . .

Originally Posted by Kenny

I've always had trouble with the 'px' deal. Here's what I whipped up from the original code . . .

Poor cat. Yep, that looks like another way. However, even with your trouble with the 'px' deal, I see that you use (for example):

Originally Posted by Kenny

Code:

 . . . g').style.width = '150px';

which acknowledges:

Originally Posted by me

The style width property is a string that includes the type of units being used, not a raw number . . .

and uses the 'px' deal. There's no real way to totally avoid the facts of the matter.

**Twey** · 11-11-2007, 05:02 AM

Code:

        var s = el.style, w = 'width', h = 'height';
        if(s[w] != '150px'){
                s[w] = '150px';
                s[h] = '200px';
        }

I've noticed this pattern in your code of late. Why do you do it?

Also, you've started indenting now?

**jscheuer1** · 11-11-2007, 05:48 AM

Originally Posted by Twey

I've noticed this pattern in your code of late. Why do you do it?

I am assuming you mean condensing via variable assignment. Isn't that the way efficient machine code works? In any case, sometimes I just get tired typing, and/or the ideas come too fast.

Originally Posted by Twey

Also, you've started indenting now?

You are hard to please. If I condense my code 'you complain.' If I expand it 'you complain.'

In this particular case I just thought I would give the OP a break so that they could read it more easily.

I like to think of myself as an aspiring code virtuoso. I can write it . . . however, and still know what it means. I stress the word 'aspiring', but I'm making progress.

Sometimes I'm in a hurry. Some other times I'm stopping to smell the roses. But most times I try to make the code as clear and as efficient as the particular situation calls for.

It has been my experience that folks will often ask questions if they don't initially get the' how and why', and want to.

**Twey** · 11-11-2007, 06:06 AM

You are hard to please. If I condense my code 'you complain.' If I expand it 'you complain.'

Oh, on the contrary, I'm quite pleased about it, I was just surprised since you've previously said you hated indentation in any form and found that you had to try harder to read even properly-indented code.

I am assuming you mean condensing via variable assignment. Isn't that the way efficient machine code works? In any case, sometimes I just get tired typing, and/or the ideas come too fast.

Ah, the slowdown comes from the lookup: if we have a.b.c.d and we access it multiple times, it's more efficient to store e = a.b.c then access it as e.d. For a single property name, there is no slowdown, and I'd suspect that assigning it to a variable and then doing a string lookup would actually be slower, albeit only marginally.

**jscheuer1** · 11-11-2007, 06:28 AM

There is a reason why I put 'you complain' in quotes. I wasn't saying that you really were upset or even expressing that you were. In any case, the indenting or lack thereof is never meant to be for or against you, or anyone.

I'm not all about top code efficiency, but I do like to adopt, as I go along, techniques for it*. I also reserve the right to write as I see fit, as it were, 'as it comes off my pen', and as I see fit to edit it.

*to wit - I'm going to be using a lot more of:

Code:

for (var i=some.length-1 ; i>-1; --i)

than I have heretofore.

Thread: what's with this image?

Thread Tools

Search Thread

what's with this image?

Bookmarks

Bookmarks

Posting Permissions