I successfully implemented a simple drop down selection.
Question:

1) If I change
$("#tl,#ch,#sg,#mt").hide();
to
$("#tl,#ch,#sg,#mt").fadeOut();
I end up with a nasty blinker effect, because the new image fades out
while the new one fades in. How can I can this?

2) Is it clean to let the
<option value="none" selected="selected">choose...</option>
execute, when I select it?

3) Can my jQuery be done simplyer?


<code>===================
css:
#tl,#ch,#sg,#mt {display:none;}

jQuery:
$(document).ready(function(){
$("#dropdown").change(function(event) {
                var inhalt = $("select option:selected").val();
                $("#tl,#ch,#sg,#mt").hide();
                $("img#"+inhalt).fadeIn("slow");
                console.log("img#"+inhalt);
});
});


html:
<select id="dropdown">
        <option value="none" selected="selected">choose...</option>
        <option value="tl">Thomas</option>
        <option value="ch">Christof</option>
        <option value="sg">Sandra</option>
        <option value="mt">Myriam</option>
</select>

<hr>

        <img src="tl.jpg" alt="tl" id="tl" />
        <img src="ch.jpg" alt="ch" id="ch" />
        <img src="sg.jpg" alt="sg" id="sg" />
        <img src="mt.jpg" alt="mt" id="mt" />

</code>===================

Reply via email to