Using Href Links Inside Tag To Link To Url

i just downloaded the source code from this topic http://tympanus.net/codrops/2012/11/29/simple-effects-for-drop-down-lists/ demo http://tympanus.net/Development/SimpleDropDownEff

Solution 1:

Try this

<selectid="cd-dropdown"name="cd-dropdown"class="cd-select"><optionvalue="-1"selected>choose an option to test</option><optionvalue="1"class="icon-monkey">Students</option><optionvalue="2"class="icon-bear">Courses</option><optionvalue="3"class="icon-squirrel">Instructors</option><optionvalue="4"class="icon-elephant">Departments</option></select><scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><scripttype="text/javascript">jQuery('#cd-dropdown').on('change', function(){
        if(jQuery(this).val() == 1){
        window.location.href = 'http://google.com'
        }
        // and so on
        })
</script>

You have to give the destination URL for all options jQuery code.

Solution 2:

Try this

$('#cd-dropdown').on('change', function(){
var value = $(this).val();
if(value == 1){ // that is for Studentswindow.location.href = 'http://google.com';
}
// and so on
})

Solution 3:

Try This

$('.cd-dropdown li').click(function(){
  if($(this).attr('data-value')==1){
    window.location.href = 'http://google.com';
  }

})

The plugin replaces select box [id=cd-dropdown] with ul [class=cd-dropdown]