/    Sign up×
Community /Pin to ProfileBookmark

How to change width of <select> dynamically??

Copy linkTweet thisAlerts:
Nov 23.2007

How can I change the width of <Select> dynamically? .. onMouseOver may be.

to post a comment
JavaScript

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@UI-ZEIKVKNov 23.2007 — check

[code=html]
<html>
<head>
<script type="text/JavaScript" language="JavaScript">
function setWidth( obj, val)
{
obj.style.width = val+'px';
}
</script>
</head>
<body>
<select name="list_year" id="list_year" onmouseover="setWidth(this, '400')">
<option value="2007" selected>2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
</select>
</body>
</html>
[/code]

Cheers!
Copy linkTweet thisAlerts:
@ali_hammadauthorNov 23.2007 — Thank you very much for such a timely response. I really appreciate that.

I want one more thing. OnMouseOver dropdown's width increased, but I want that as the mouse moves away from drop down, its width again becomes original.

Thanks in advance
Copy linkTweet thisAlerts:
@ali_hammadauthorNov 23.2007 — waiting for any reply ?
Copy linkTweet thisAlerts:
@UI-ZEIKVKNov 23.2007 — <html>

<head>

<script type="text/JavaScript" language="JavaScript">

var defaultWidth;

function setWidth( obj, val)

{

defaultWidth = obj.style.width;

obj.style.width = val+'px';

}

function restoreWidth( obj)

{

obj.style.width = defaultWidth;

}

</script>

</head>

<body>

<select name="list_year" id="list_year" style="width:200px;" onmouseover="setWidth(this, '400')" onmouseout="restoreWidth(this)">

<option value="2007" selected>2007</option>

<option value="2008">2008</option>

<option value="2009">2009</option>

<option value="2010">2010</option>

</select>

</body>

</html>

Cheers!
Copy linkTweet thisAlerts:
@ali_hammadauthorNov 23.2007 — Thanks again..
Copy linkTweet thisAlerts:
@UI-ZEIKVKNov 26.2007 — You are welcome!
×

Success!

Help @ali_hammad spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...