Question

I am trying to select an option in a drop down menu form on a web page using Mechanize.

so far I have the following:

import mechanize as mc

br = mc.Browser()
br.open(url='http://www.marseille-port.fr/fr/Page/Escale_consultation/13286')

which works fine. But then I try to find the names of all the forms on the page using:

for form in br.forms():
    print "Form name:", form.name
    print form

but all i get back is what looks like a load of gobbledygook.

How do I select the "VRACS LIQUIDES" option from the drop down menu entitled "Type of Vessel"? Is there anyway I can use the br.forms() method to better effect?

Thanks in advance

Edit:

The gobbledygook returned is as follows:

Form name: RBS_FORM
<RBS_FORM POST http://www.marseille-port.fr/fr/Page/Escale_consultation/13286 application/x-www-form-urlencoded
  <HiddenControl(radscriptmanager_TSM=) (readonly)>
  <HiddenControl(__VIEWSTATE=/wEPDwULLTE4NTY1ODI0NTMPZBYCAgMPFgIeBGxhbmcFAmZyFgJmDxYCHgZhY3Rpb24FIi9mci9QYWdlL0VzY2FsZV9jb25zdWx0YXRpb24vMTMyODYWBAIDD2QWAmYPZBYEZg9kFgJmDxQrAAIUKwACDxYCHhdFbmFibGVBamF4U2tpblJlbmRlcmluZ2hkZGRkAgEPZBYCZg8UKwACFCsAAg8WAh8CaGQPFCsACRQrAAIPFgYeBFRleHQFB0FjY3VlaWweC05hdmlnYXRlVXJsBSBodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyLx4GVGFyZ2V0ZWRkFCsAAg8WBh8DBRFCdWxsZXRpbiBPZmZpY2llbB8EBURodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvQnVsbGV0aW4lMjBPZmZpY2llbC8xMDAwMy9maXhlZB8FZWRkFCsAAg8WBh8DBQZFbXBsb2kfBAU3aHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0VtcGxvaS8xMjk5OC9maXhlZB8FZWRkFCsAAg8WBh8DBQtDcm9pc2nDqHJlcx8EBUBodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvQ3JvaXNpJWMzJWE4cmVzLzEwMDA2L2ZpeGVkHwVlZBAWBGYCAQICAgMWBBQrAAIPFgYfAwUsTWFyc2VpbGxlIEZvcywgcG9ydGUgb3V2ZXJ0ZSBzdXIgbGEgUHJvdmVuY2UfBAV5aHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0Nyb2lzaSVjMyVhOHJlcy1NYXJzZWlsbGUlMjBGb3MsJTIwcG9ydGUlMjBvdXZlcnRlJTIwc3VyJTIwbGElMjBQcm92ZW5jZS8xMzAyMC9maXhlZB8FZWRkFCsAAg8WBh8DBRxHYXJlcyBtYXJpdGltZXMgZXQgdGVybWluYXV4HwQFY2h0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9Dcm9pc2klYzMlYThyZXMtR2FyZXMlMjBtYXJpdGltZXMlMjBldCUyMHRlcm1pbmF1eC8xMzAyMS9maXhlZB8FZWRkFCsAAg8WBh8DBQhQYXJraW5ncx8EBUlodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvQ3JvaXNpJWMzJWE4cmVzLVBhcmtpbmdzLzEzMDIyL2ZpeGVkHwVlZGQUKwACDxYGHwMFE0luZm9ybWF0aW9ucyB1dGlsZXMfBAVWaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0Nyb2lzaSVjMyVhOHJlcy1JbmZvcm1hdGlvbnMlMjB1dGlsZXMvMTMwMjMvZml4ZWQfBWVkZA8WBGZmZmYWAQV0VGVsZXJpay5XZWIuVUkuUmFkTWVudUl0ZW0sIFRlbGVyaWsuV2ViLlVJLCBWZXJzaW9uPTIwMTIuMy4xMDE2LjQwLCBDdWx0dXJlPW5ldXRyYWwsIFB1YmxpY0tleVRva2VuPTEyMWZhZTc4MTY1YmEzZDQUKwACDxYGHwMFCVBhc3NhZ2Vycx8EBTpodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvUGFzc2FnZXJzLzEzMDA1L2ZpeGVkHwVlZBAWA2YCAQICFgMUKwACDxYGHwMFHkxpZ25lcyByw6lndWxpw6hyZXMgbmF0aW9uYWxlcx8EBWVodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvUGFzc2FnZXJzLUxpZ25lcyUyMHIlYzMlYTlndWxpJWMzJWE4cmVzJTIwbmF0aW9uYWxlcy8xMzAwNi9maXhlZB8FZWRkFCsAAg8WBh8DBSNMaWduZXMgcsOpZ3VsacOocmVzIGludGVybmF0aW9uYWxlcx8EBWpodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvUGFzc2FnZXJzLUxpZ25lcyUyMHIlYzMlYTlndWxpJWMzJWE4cmVzJTIwaW50ZXJuYXRpb25hbGVzLzEzMDA3L2ZpeGVkHwVlZGQUKwACDxYGHwMFE0luZm9ybWF0aW9ucyB1dGlsZXMfBAVQaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL1Bhc3NhZ2Vycy1JbmZvcm1hdGlvbnMlMjB1dGlsZXMvMTMwMDgvZml4ZWQfBWVkZA8WA2ZmZhYBBXRUZWxlcmlrLldlYi5VSS5SYWRNZW51SXRlbSwgVGVsZXJpay5XZWIuVUksIFZlcnNpb249MjAxMi4zLjEwMTYuNDAsIEN1bHR1cmU9bmV1dHJhbCwgUHVibGljS2V5VG9rZW49MTIxZmFlNzgxNjViYTNkNBQrAAIPFgYfAwUPVmlzaXRleiBsZSBQb3J0HwQFRGh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9WaXNpdGV6JTIwbGUlMjBQb3J0LzEzNDc2L2ZpeGVkHwVlZGQUKwACDxYGHwMFEExpZ25lcyBtYXJpdGltZXMfBAVDaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0xpZ25lcyUyMG1hcml0aW1lcy8xMDIwMC9maXhlZB8FZWQQFgJmAgEWAhQrAAIPFgYfAwUfVW5lIG9mZnJlIG1hcml0aW1lIGRpdmVyc2lmacOpZR8EBW1odHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvTGlnbmVzJTIwbWFyaXRpbWVzLVVuZSUyMG9mZnJlJTIwbWFyaXRpbWUlMjBkaXZlcnNpZmklYzMlYTllLzEzMDYxL2ZpeGVkHwVlZGQUKwACDxYGHwMFHUxpZ25lcyBtYXJpdGltZXMgcsOpZ3VsacOocmVzHwQFbWh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9MaWduZXMlMjBtYXJpdGltZXMtTGlnbmVzJTIwbWFyaXRpbWVzJTIwciVjMyVhOWd1bGklYzMlYThyZXMvMTMwNjQvZml4ZWQfBWVkZA8WAmZmFgEFdFRlbGVyaWsuV2ViLlVJLlJhZE1lbnVJdGVtLCBUZWxlcmlrLldlYi5VSSwgVmVyc2lvbj0yMDEyLjMuMTAxNi40MCwgQ3VsdHVyZT1uZXV0cmFsLCBQdWJsaWNLZXlUb2tlbj0xMjFmYWU3ODE2NWJhM2Q0FCsAAg8WBh8DBRJQcm9qZXRzIGV1cm9ww6llbnMfBAVJaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL1Byb2pldHMlMjBldXJvcCVjMyVhOWVucy8xMzk3Ni9maXhlZB8FZWRkFCsAAg8WBh8DBQZNUDIwMTMfBAU3aHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL01QMjAxMy8xMzU5NC9maXhlZB8FZWQQFgNmAgECAhYDFCsAAg8WBh8DBQ1MZSBzaXRlIGR1IEoxHwQFS2h0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9NUDIwMTMtTGUlMjBzaXRlJTIwZHUlMjBKMS8xMzkwMS9maXhlZB8FZWRkFCsAAg8WBh8DBSIzIHNhaXNvbnMgZCdleHBvc2l0aW9uIHN1ciBsZSBQb3J0HwQFZGh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9NUDIwMTMtMyUyMHNhaXNvbnMlMjBkJ2V4cG9zaXRpb24lMjBzdXIlMjBsZSUyMFBvcnQvMTM5MTEvZml4ZWQfBWVkZBQrAAIPFgYfAwUSQSBuZSBwYXMgbWFucXVlciAhHwQFUmh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9NUDIwMTMtQSUyMG5lJTIwcGFzJTIwbWFucXVlciUyMCEvMTM5MTQvZml4ZWQfBWVkZA8WA2ZmZhYBBXRUZWxlcmlrLldlYi5VSS5SYWRNZW51SXRlbSwgVGVsZXJpay5XZWIuVUksIFZlcnNpb249MjAxMi4zLjEwMTYuNDAsIEN1bHR1cmU9bmV1dHJhbCwgUHVibGljS2V5VG9rZW49MTIxZmFlNzgxNjViYTNkNA8UKwEJZmZmZmZmZmZmFgEFdFRlbGVyaWsuV2ViLlVJLlJhZE1lbnVJdGVtLCBUZWxlcmlrLldlYi5VSSwgVmVyc2lvbj0yMDEyLjMuMTAxNi40MCwgQ3VsdHVyZT1uZXV0cmFsLCBQdWJsaWNLZXlUb2tlbj0xMjFmYWU3ODE2NWJhM2Q0ZBYSZg8PFgYfAwUHQWNjdWVpbB8EBSBodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyLx8FZWRkAgEPDxYGHwMFEUJ1bGxldGluIE9mZmljaWVsHwQFRGh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9CdWxsZXRpbiUyME9mZmljaWVsLzEwMDAzL2ZpeGVkHwVlZGQCAg8PFgYfAwUGRW1wbG9pHwQFN2h0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9FbXBsb2kvMTI5OTgvZml4ZWQfBWVkZAIDDw8WBh8DBQtDcm9pc2nDqHJlcx8EBUBodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvQ3JvaXNpJWMzJWE4cmVzLzEwMDA2L2ZpeGVkHwVlZBYIZg8PFgYfAwUsTWFyc2VpbGxlIEZvcywgcG9ydGUgb3V2ZXJ0ZSBzdXIgbGEgUHJvdmVuY2UfBAV5aHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0Nyb2lzaSVjMyVhOHJlcy1NYXJzZWlsbGUlMjBGb3MsJTIwcG9ydGUlMjBvdXZlcnRlJTIwc3VyJTIwbGElMjBQcm92ZW5jZS8xMzAyMC9maXhlZB8FZWRkAgEPDxYGHwMFHEdhcmVzIG1hcml0aW1lcyBldCB0ZXJtaW5hdXgfBAVjaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0Nyb2lzaSVjMyVhOHJlcy1HYXJlcyUyMG1hcml0aW1lcyUyMGV0JTIwdGVybWluYXV4LzEzMDIxL2ZpeGVkHwVlZGQCAg8PFgYfAwUIUGFya2luZ3MfBAVJaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0Nyb2lzaSVjMyVhOHJlcy1QYXJraW5ncy8xMzAyMi9maXhlZB8FZWRkAgMPDxYGHwMFE0luZm9ybWF0aW9ucyB1dGlsZXMfBAVWaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0Nyb2lzaSVjMyVhOHJlcy1JbmZvcm1hdGlvbnMlMjB1dGlsZXMvMTMwMjMvZml4ZWQfBWVkZAIEDw8WBh8DBQlQYXNzYWdlcnMfBAU6aHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL1Bhc3NhZ2Vycy8xMzAwNS9maXhlZB8FZWQWBmYPDxYGHwMFHkxpZ25lcyByw6lndWxpw6hyZXMgbmF0aW9uYWxlcx8EBWVodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvUGFzc2FnZXJzLUxpZ25lcyUyMHIlYzMlYTlndWxpJWMzJWE4cmVzJTIwbmF0aW9uYWxlcy8xMzAwNi9maXhlZB8FZWRkAgEPDxYGHwMFI0xpZ25lcyByw6lndWxpw6hyZXMgaW50ZXJuYXRpb25hbGVzHwQFamh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9QYXNzYWdlcnMtTGlnbmVzJTIwciVjMyVhOWd1bGklYzMlYThyZXMlMjBpbnRlcm5hdGlvbmFsZXMvMTMwMDcvZml4ZWQfBWVkZAICDw8WBh8DBRNJbmZvcm1hdGlvbnMgdXRpbGVzHwQFUGh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9QYXNzYWdlcnMtSW5mb3JtYXRpb25zJTIwdXRpbGVzLzEzMDA4L2ZpeGVkHwVlZGQCBQ8PFgYfAwUPVmlzaXRleiBsZSBQb3J0HwQFRGh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9WaXNpdGV6JTIwbGUlMjBQb3J0LzEzNDc2L2ZpeGVkHwVlZGQCBg8PFgYfAwUQTGlnbmVzIG1hcml0aW1lcx8EBUNodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvTGlnbmVzJTIwbWFyaXRpbWVzLzEwMjAwL2ZpeGVkHwVlZBYEZg8PFgYfAwUfVW5lIG9mZnJlIG1hcml0aW1lIGRpdmVyc2lmacOpZR8EBW1odHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvTGlnbmVzJTIwbWFyaXRpbWVzLVVuZSUyMG9mZnJlJTIwbWFyaXRpbWUlMjBkaXZlcnNpZmklYzMlYTllLzEzMDYxL2ZpeGVkHwVlZGQCAQ8PFgYfAwUdTGlnbmVzIG1hcml0aW1lcyByw6lndWxpw6hyZXMfBAVtaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0xpZ25lcyUyMG1hcml0aW1lcy1MaWduZXMlMjBtYXJpdGltZXMlMjByJWMzJWE5Z3VsaSVjMyVhOHJlcy8xMzA2NC9maXhlZB8FZWRkAgcPDxYGHwMFElByb2pldHMgZXVyb3DDqWVucx8EBUlodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvUHJvamV0cyUyMGV1cm9wJWMzJWE5ZW5zLzEzOTc2L2ZpeGVkHwVlZGQCCA8PFgYfAwUGTVAyMDEzHwQFN2h0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9NUDIwMTMvMTM1OTQvZml4ZWQfBWVkFgZmDw8WBh8DBQ1MZSBzaXRlIGR1IEoxHwQFS2h0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9NUDIwMTMtTGUlMjBzaXRlJTIwZHUlMjBKMS8xMzkwMS9maXhlZB8FZWRkAgEPDxYGHwMFIjMgc2Fpc29ucyBkJ2V4cG9zaXRpb24gc3VyIGxlIFBvcnQfBAVkaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL01QMjAxMy0zJTIwc2Fpc29ucyUyMGQnZXhwb3NpdGlvbiUyMHN1ciUyMGxlJTIwUG9ydC8xMzkxMS9maXhlZB8FZWRkAgIPDxYGHwMFEkEgbmUgcGFzIG1hbnF1ZXIgIR8EBVJodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvTVAyMDEzLUElMjBuZSUyMHBhcyUyMG1hbnF1ZXIlMjAhLzEzOTE0L2ZpeGVkHwVlZGQCBw9kFgJmD2QWAmYPZBYEZg8WAh4IVGVtcGxhdGUFLzxkaXYgY2xhc3M9ImNvbnRlbnQtYXJlYSIgbmFtZT0iY29udGVudCI+PC9kaXY+ZAIBD2QWAmYPFCsAAhQrAAIPFgIfAmhkDxQrAAIUKwACDxYIHwMFJENhcGl0YWluZXJpZSBldCBzw6ljdXJpdMOpIHBvcnR1YWlyZR8EBWNodHRwOi8vd3d3Lm1hcnNlaWxsZS1wb3J0LmZyL2ZyL1BhZ2UvQ2FwaXRhaW5lcmllJTIwZXQlMjBzJWMzJWE5Y3VyaXQlYzMlYTklMjBwb3J0dWFpcmUvMTAwMTcvZml4ZWQfBWUeCFNlbGVjdGVkaGRkFCsAAg8WCB8DBRhDb25zdWx0YXRpb24gZGVzIGVzY2FsZXMfBAVNaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0NvbnN1bHRhdGlvbiUyMGRlcyUyMGVzY2FsZXMvMTMyODYvZml4ZWQfBWUfB2dkZA8UKwECZmYWAQV3VGVsZXJpay5XZWIuVUkuUmFkU2l0ZU1hcE5vZGUsIFRlbGVyaWsuV2ViLlVJLCBWZXJzaW9uPTIwMTIuMy4xMDE2LjQwLCBDdWx0dXJlPW5ldXRyYWwsIFB1YmxpY0tleVRva2VuPTEyMWZhZTc4MTY1YmEzZDRkFgRmDw8WCB8DBSRDYXBpdGFpbmVyaWUgZXQgc8OpY3VyaXTDqSBwb3J0dWFpcmUfBAVjaHR0cDovL3d3dy5tYXJzZWlsbGUtcG9ydC5mci9mci9QYWdlL0NhcGl0YWluZXJpZSUyMGV0JTIwcyVjMyVhOWN1cml0JWMzJWE5JTIwcG9ydHVhaXJlLzEwMDE3L2ZpeGVkHwVlHwdoZGQCAQ8PFggfAwUYQ29uc3VsdGF0aW9uIGRlcyBlc2NhbGVzHwQFTWh0dHA6Ly93d3cubWFyc2VpbGxlLXBvcnQuZnIvZnIvUGFnZS9Db25zdWx0YXRpb24lMjBkZXMlMjBlc2NhbGVzLzEzMjg2L2ZpeGVkHwVlHwdnZGQYAQUeX19Db250cm9sc1JlcXVpcmVQb3N0QmFja0tleV9fFgQFDk9CSl82MDAwMDEwM18wBRZPQkpfOTAwMDAxMjVfMCRyYWRtZW51BRZPQkpfNjAwMDAxMDVfMCRyYWRtZW51BRlPQkpfNjAwMDAxMTBfMCRyYWRzaXRlbWFw+UFoJy18wXduNOccW3Zrk3TB006mu83w6MD9bECvPoc=) (readonly)>
  <HiddenControl(__EVENTVALIDATION=/wEWBQLTiIP0DALgyIDjDAKe1c2JCgK4oYOhDQL7yb/5BffLeOZ+lEq70djr/KIO9pPd70KCFfpxP7RAtn3CKcyZ) (readonly)>
  <HiddenControl(OBJ_60000105_0_radmenu_ClientState=) (readonly)>
  <HiddenControl(OBJ_90000125_0_radmenu_ClientState=) (readonly)>
  <HiddenControl(OBJ_60000110_0_radsitemap_ClientState=) (readonly)>
  <HiddenControl(OBJ_60000151_0=) (readonly)>
  <HiddenControl(OBJ_60000151_0_SCROLLTOP=0) (readonly)>
  <TextControl(OBJ_60000119_0=)>
  <SubmitControl(OBJ_60000120_0=Rechercher) (readonly)>
  <HiddenControl(PAGECONTROLE=635110847692788750,0) (readonly)>
  <HiddenControl(EventObject=) (readonly)>
  <HiddenControl(EventMethode=) (readonly)>
  <HiddenControl(EventArgs=) (readonly)>> 
Was it helpful?

Solution

Your trouble here is that there is javascript being executed (note the "Merci de bien vouloir patienter le temps de téléchargement de l'application." message) when you visit the page, and mechanize doesn't quite handle that. The javascript creates a frame. The form you want is there, and its name is "EscaleForm" -- but mechanize cannot read it, because it isn't in the response it gets from its request.

You can check it by yourself. Do

# -*- coding: utf-8 -*-

import mechanize as mc
from BeautifulSoup import BeautifulSoup as bs

br = mc.Browser()
br.open(url='http://www.marseille-port.fr/fr/Page/Escale_consultation/13286')
html = r.read()
test = open('test.html', 'wb')
print >> test, "%s" % (bs(html).prettify())  
test.close()

and look at the source of test.html. You won't see the controls you are looking for. This is what mechanize "sees". Then open the page in your web browser, wait a few seconds and look at its source. Look for a form named "EscaleForm". There you'll find the controls the want.

I don't think there is a way of crawling this website with mechanize. You may want to look at Selenium instead.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top