Calling colorbox from a dropdown list

Question

I'm trying to implement calling colorbox items from a dropdown menu. Using this example, http://www.jacklmoore.com/colorbox/example4/, how could I simply call these links from a drop down menu? It seems to work fine in every browser except IE without any additional scripting. I'm sure it's going to be simple fix for anyone with true coding skills. Can anyone help me out?

Answer 1

I found something similar after a quick google search

I can't say whether or not this works, but why don't you give it a shot working this code into your jsfiddle, and I'll see if I can help you debug any issues that arise.

from: https://groups.google.com/forum/?fromgroups=#!topic/colorbox/OM85IPMoyP4

<select name="howheard" id="howheard" class="validate[required]"> 
  <option value="http://example1.com">Example 1</option> 
  <option value="http://example2.com">Example 2</option> 
  <option value="http://example3.com">Example 3</option> 
</select> 

EDIT: updadate colorbox() init:

<script> 
   $(document).ready(function(){ 
      $("#howheard").change(function () { 
          var thisHref = $(this).val();
          $.colorbox({iframe:true, width:"80%", height:"80%", href: thisHref}); 
      }); 
   }); 
</script>