Silvestru Posted May 17, 2018 Share Posted May 17, 2018 Hello forum, I am pretty new to this so I would really appreciate your help. I have the below code: <select id="dynamic_select"> <option value="" selected>Pick a Website</option> <option value="http://www.google.com">Google</option> <option value="http://www.youtube.com">YouTube</option> <option value="https://www.gurustop.net">GuruStop.NET</option> </select> <script> $(function(){ // bind change event to select $('#dynamic_select').on('change', function () { var url = $(this).val(); // get selected value if (url) { // require a URL window.location = url; // redirect } return false; }); }); </script> On my page it looks like this: My question is, how can I link this code to an image so when you click on said image, the drop-down appears. So you can only see this selection after you press on the image. Thank you very much in advance for the help! Link to comment Share on other sites More sharing options...
Sensei Posted May 17, 2018 Share Posted May 17, 2018 (edited) Here you go.. <html> <head> <script type="text/javascript"> function changeBackground( image ) { document.getElementById( 'duck' ).style.backgroundImage = "url( " + image + " )"; } </script> <style> #duck { width: 500px; height: 500px; color: red; text-align: center; font-size: 50px; background-image: url( "duck1.jpg" ); } </style> </head> <body> <select id="duck"> <option onclick="changeBackground( 'duck1.jpg' );">Duck 1</option> <option onclick="changeBackground( 'duck2.jpg' );">Duck 2</option> <option onclick="changeBackground( 'duck3.jpg' );">Duck 3</option> </select> </body> </html> I tried it with Firefox only.. So you will have to check whether it works also in Chrome, IE and Opera by yourself.. Edited May 17, 2018 by Sensei 1 Link to comment Share on other sites More sharing options...
Silvestru Posted May 17, 2018 Author Share Posted May 17, 2018 arigatou gozaimasu! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now