Currently in the process of learning jQuery, I have managed to create a button that toggles a div containing colored buttons when clicked:
https://i.sstatic.net/VNxym.png
Once these colored buttons are pressed, the main white button changes color based on the selected option. However, I am now looking for a way to have this div of colored buttons slide out from the button div (preferably to the right) upon mouse hover so they can be easily selected.
Here is the progress I've made with jQuery so far:
//Functionality for clicking different colors
$("ul").on("click", "li", function() {
$('button').removeClass().addClass(this.className);
});
//Action when white button is pressed
$("#revealColorSelect").click(function(){
//Toggle visibility of color selection
changeColor();
$("#colorSelect").toggle();
});
//Update selected color
function changeColor() {
var p = $("#pink").val();
var pur = $("#purple").val();
var r = $("#red").val();
var b = $("#blue").val();
var g = $("#green").val();
var o = $("#orange").val();
};