Javascript not working for max / min button?
I am doing maximization / minimization of the button.my function. javascript code doesn't work. Run me some solution for it. Thanks in advance.
here is my code
<html>
<head>
<script>
$(function () {
$(".button-open").hide();
$(".button-close").bind("click", function () {
$(".box").hide(100);
if ($(this).attr("class") == "button-close")
{
$(".button-open").show();
}
});
});
$(".button-open").bind("click", function () {
$(".box").show(100);
if ($(this).attr("class") == "button-open")
{
$(".button-open").hide();
}
});
</script>
</head>
<body>
<div class="button-open">Open</div>
<div class="box">
<div class="button-close">X</div>
</div>
</body>
</html>
+3
source to share
2 answers
Don't forget to include the jQuery file before using the jQuery syntax. If you don't want to use JQuery, you need to write pure Javascript. But it will be an easy solution for you if you are just referencing JQuery in your HTML.
$(function () {
$(".box").hide();
$(".button-close").bind("click", function () {
$(".box").hide(100);
if ($(this).attr("class") == "button-close")
{
$(".button-open").show();
}
});
});
$(".button-open").bind("click", function () {
$(".box").show(100);
if ($(this).attr("class") == "button-open")
{
$(".button-open").hide();
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="button-open">Open</div>
<div class="box">
<div class="button-close">X</div>
+3
source to share