...

View Full Version : Button links Scroll box



jbrown1028
06-09-2008, 02:53 PM
Has anyone ever seen this before? I have a list of about 15 different color schemes, although I have 5 Accessibility Themes that I would like quick button access to, When the user clicks on the button it will change the drop down to the correct color scheme. My Mootools will do the rest from there, when they click on Apply Colors.

For those of you who want to see an example, you can go to www.jbrowns.com/clients/rjs and click on the color chooser. You will see everything there.

<script type="text/javascript">
function changeText(){
var x=document.getElementById("color-select")
*** What do I need here ***
}
</script>

<select id="color-select">
<option>Black</option>
<option>White</option>
<option>Red</option>
<option>Green</option>
</select>

<img src="/images/Green.png" width="32px" onclick="changeText()" />
<img src="/images/Black.png" width="32px" onclick="changeText()" />
<img src="/images/White.png" width="32px" onclick="changeText()" />

Thanks,
Jeff

Kor
06-09-2008, 04:43 PM
Could be:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>untitled</title>
<script type="text/javascript">
function changeText(c){
var opt=document.getElementById("color-select").options, i=0, o;
while(o=opt[i++]){
o.selected=o.text==c;
}
}
</script>
</head>
<body>
<form>
<select id="color-select">
<option value="Black">Black</option>
<option value="White">White</option>
<option value="Red">Red</option>
<option value="Green">Green</option>
</select>
<br>
<span onclick="changeText('Black')">Black</span>
<span onclick="changeText('White')">White</span>
<span onclick="changeText('Red')">Red</span>
<span onclick="changeText('Green')">Green</span>
</form>
</body>
</html>

jbrown1028
06-09-2008, 05:08 PM
Great Job Kor...

Yes, I wasn't even think a to use while syntax for this method. Although still having an issue (now I believe it is in my coding for the color switcher) this functioned perfectly.

Thank you

jbrown1028
06-10-2008, 09:35 PM
Since this is a completly custom code, and I don't think anyone else would ever use it, with the assistance of Kor for the first part and I found the remainding solution to the problem.

By adding this to the <script></script>:
window.addEvent('domready', function() {
var colorSelect = $('color-select');
$$('.abutton').addEvent('click', function() {
colorSelect.fireEvent('change');
});
});

and adding class="abutton" to the <img> tags worked perfectly.

Kor
06-11-2008, 07:49 AM
Since this is a completly custom code, and I don't think anyone else would ever use it, with the assistance of Kor for the first part and I found the remainding solution to the problem.

By adding this to the <script></script>:
window.addEvent('domready', function() {
var colorSelect = $('color-select');
$$('.abutton').addEvent('click', function() {
colorSelect.fireEvent('change');
});
});

and adding class="abutton" to the <img> tags worked perfectly.
Take care not to confound javascript language with custom methods of javascript frameworks/libraries. There is no $() $$() addEvent() or fireEvent() native methods in javascript. :)

jbrown1028
06-11-2008, 01:57 PM
Take care not to confound javascript language with custom methods of javascript frameworks/libraries. There is no $() $$() addEvent() or fireEvent() native methods in javascript. :)

Ahh yes, this is a huge custom script that is combining Mootools, Ajax, JavaScript with PHP.

So yes, those are not native methods for JS, sorry for the confusion for anyone.

Thanks for the heads up.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum