473,406 Members | 2,217 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,406 software developers and data experts.

reset the width of image

Hi there,
First of all, I am trying to reset the width of the image while
loading

<img src='s.jpg' onload="javascript:if(this.width>120)
this.width=100;">

It's ok. And then I am going to make the code more flexible

<img src='s.jpg'
onload="javascript:if(this.width>javascript:window .document.body.offsetWidth)
this.width=50;">

this time, I compare the image width with the offsetWidth, however, I
found the code above didn't work no matter how small offsetWidh is
made.

BTW, I would like to make the width of image fit the current width of
the document, only HTML works fine under IE

<img src='s.jpg' width="100%" LEFTMARGIN=10>

But when applying the above code to the image of small size, it always
try to strech the image ,which will then look very bad.

I am trying to apply the code on condiiton: when the width of image is
smaller than a given value, do nothing; otherwise add "width=100%
LEFTMARGIN=10". Here is the javascript I tried

<img src='s.jpg' onload="javascript:if(this.width>100)
javascript:document.write('WIDTH=100% LEFTMARGIN=10');">

However, it didn't give the result I want. Would someone please give me
some clues?

thanks in advance.

Mar 6 '06 #1
1 5303

wa***@wakun.com wrote:
<img src='s.jpg' onload="javascript:if(this.width>100)
javascript:document.write('WIDTH=100% LEFTMARGIN=10');">

However, it didn't give the result I want. Would someone please give me
some clues?


1. Get rid of javascript pseudo-protocols. If you do a search about it
within this group, you'll get lots of reasons why not to use it.
2. You're using document.write. It's performing an action which you
are not expecting.

I prefer not to use inline javascript, but here's something that can
get you started:

javascript:

function adjustImg(oImg)
{
if(oImg.width > 100)
{
oImg.style.width = "100%";
oImg.style.marginLeft = "10px";
}
}

html:

<img src = "path/name.ext" onload = "adjustImg(this)">

Mar 6 '06 #2

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: Stephen Weatherly | last post by:
Could anyone please help me with a problem I am having with my table widths??? If I have 2 images within a td tag, but using CSS relative positioning I position one over the top of the second (I...
5
by: Nathan Sokalski | last post by:
I have a user control that contains three variables which are accessed through public properties. They are declared immediately below the "Web Form Designer Generated Code" section. Every time an...
1
by: jmgro | last post by:
I have spent way too much time trying to solve the following problem: I have a datalist with a timer in the footer template. It works wonderfully except when the user pages back, then forward,...
1
by: sck10 | last post by:
Hello, I have a table with some controls in it, but it is not rapped in a form. I also have a button for reseting the page. When I click the button, the page resets, but I get the following...
3
by: kashif_khan | last post by:
hi everyone, can anybody please tell me why reset button is not working in the following code, i tested it in opera, firefox and konqueror, <form action='edit_links.php' method='POST'...
2
by: Atul | last post by:
I am unable to find image height and width in mozilla firefox. My code is working in IE but not in Mozilla. How can i find image width and height in mozilla? function check(sel) { if(sel != "")...
7
by: Peter Parker | last post by:
Could someone show me how to limit caption width to image width dynamically (image width is not known in advance) if that's possible? I was thinking of using Javascript to get the image width which...
16
by: Animesh K | last post by:
What's the best practice for using an image for a reset button? Unfortunately, we cannot use <input type="image" src="..."in this case. Any helpful tutorial from the web will be appreciated. I...
2
by: DarthPeePee | last post by:
Hello everyone. I am working on a Password Strength Meter and I am running into 1 problem that I would like to fix. When pressing the "Clear Password & Try Again" button, the password clears...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.