click the div increase click again decrease

Question

click the div increase click again decrease

Navigation

#1 by (5 votes)

1

If you can help me with this question I would like to click on a div that is fixed on the rod and it increases and then click again and it decreases, how do I do that?

javascript html css

asked by anonymous 26.11.2016 / 02:56

1 answer

Help to populate an array with objects using a while How to know how many "black" pixels are in a letter x, using an x source? [closed]

score 5 · Accepted Answer

You should include some of the code you tried to do, but here's a simple example to give you at least an idea how to get started:

HTML:

<div id="div"></div>

CSS:

#div {
    height: 100px;
    width: 100px;
    background-color: red;
}

Javascript:

var big = true;

$('#div').click(function() {
  if(big) {
    big = false;
    $(this).css('height', '50px');
    $(this).css('width', '50px');
  } else {
    big = true;
    $(this).css('height', '100px');
    $(this).css('width', '100px');
  }


});

Javascript using Animation:

var big = true;

$('#div').click(function() {
  if(big) {
    big = false;
    $(this).animate({
      height : "50px",
      width : "50px"
    }, 1000);
  } else {
    big = true;
    $(this).animate({
      height : "100px",
      width : "100px"
    }, 1000);
  }


});

To see live: link

As I said, very simple, to help you as a beginner.