Home Ask Login Register

Developers Planet

Your answer is one click away!

Sudip Podder February 2016

JQuery Image Picker is not working

I am trying to develop an Image Picker following these tutorials http://jsfiddle.net/huanlin/mgvrc/ and http://rvera.github.io/image-picker/#

Here is the code I have tried so far

<!DOCTYPE html>
  <meta charset="utf-8">
  <title>Try Image Picker</title>
  <link rel="stylesheet" type="text/css" href="image-picker.css" />
  <link rel="stylesheet" type="text/css" href="style.css" />
  <script type="text/javascript" src="image-picker.js"/> </script>
  <script type="text/javascript" src="image-picker.min.js"/> </script>
    $(document).ready(function () {
        hide_select: true

      var $container = $('.image_picker_selector');
      // initialize
        $container.imagesLoaded(function () {
            columnWidth: 30,
            itemSelector: '.thumbnail'

  function myFunction() {
      document.getElementById("demo").innerHTML = "Paragraph changed.";

    <select id="selectImage" class="image-picker">
        <option value=""></option>
        <option data-img-src="o.png" value="1">  Image 1  </option>
        <option data-img-src="aa.png" value="2">  Image 2  </option>
        <option data-img-src="ee.png" value="3">  Image 3  </option>
<p id="demo">A Paragraph</p>

<button type="button" onclick="myFunction()">Try it</button>


But no image is showing in the browser. All CSS, JS scripts and images have been linked properly. Can you suggest what am I doing wrong here?


Vykintas Vaškys February 2016

This is jQuery plugin. I see it's missing in your html head.

Post Status

Asked in February 2016
Viewed 3,792 times
Voted 10
Answered 1 times


Leave an answer

Quote of the day: live life