I'd like to be able to scroll to a particular ID when a select option has been chosen from a drop down list. It seems like it should be extremely simple, however I can't find an example on here that performs how I want it to.

Basically, I have a div near the top of the page

`<div id="mainimage">CONTENT</div>`

Then lower down the page, a select box:

```
<select id="variant">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

```

What I would like to do, is - once a selection has been made - for the page to scroll back up to the id "mainimage".

If possible, ideally this would happen after a delay of around half a second, and scroll smoothly.

It seems like it should be fairly straightforward, as the page just needs to scroll to the same ID regardless of the selection.

Is this possible with javascript?

Thanks in advance.