2

I want that html select option scroll down to the div using div ID and On-click Html attribute and JavaScript (document.getElementById). but On-click attribute not working in select option. if it is not possible to use on-click attribute. Then show me another way to do this.

<select>
<option>1111111</option>
<option>2222222</option>
<option onclick="document.getElementById('divid1').scrollIntoView();">Scroll down to div id</option>
<option>4444444</option>
<option>5555555</option>
<option>6666666</option>
</select>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div id='divid1'>scroll</div>

Hoping for Answer

Victor Sigler
  • 23,243
  • 14
  • 88
  • 105
Eagle of Brasstacks
  • 75
  • 11

1 Answers1

1

This should work in Chrome, too: (use onchange event handler, and pass selected value to function)

HTML:

<select onchange="scroll_to(this.value);">
<option>1111111</option>
<option>2222222</option>
<option >Scroll down to div id</option>
<option>4444444</option>
<option>5555555</option>
<option>6666666</option>
</select>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div id='divid11'>scroll</div>

Javascript:

  function scroll_to(val) {
     if(val== "Scroll down to div id")  
        document.getElementById('divid11').scrollIntoView();
    }

Demo: http://jsfiddle.net/uya2skz5/

Btw, your first code with onclick handler, worked fine in Firefox.

sinisake
  • 11,240
  • 2
  • 19
  • 27