Hello.

I make a site . And I want my hat to fold by pressing a button. Minimize - minimizes, but I also need to change the image and position. But this is not happening.

How to fix it? Perhaps this is the case:

onclick="if (document.getElementById('spoiler').style.display != '') {getElementById('spoiler').style.display = '';document.getElementById('bottonHead').style.background = 'url(open.png)';document.getelementsbyclassname('body').style.bottom = '0px';}else {document.getElementById('spoiler').style.display = 'none';document.getElementById('bottonHead').style.background = 'url(close.png)';document.getElementsByClassName('body').style.bottom = '46px';}"

    1 answer 1

    • I recommend wrapping the code in a function, it will be nicer and clearer, and then writing so much code right in onclick is brute force ...
    • I recommend using jquery. The code will be somewhat smaller. Compare:

    document.getElementsByClassName('body') and $('.body')

    • Use $('.body').show() and $('.body').hide()

    This is just a recommendation, as simple as that.

    • Thank. What no one knows what the problem is? - ZooMka
    • there were similar questions already asked. For example, I remember asking a question when I clicked on a picture, collapse the block and replace the picture. use the search. Well, from a hint you can create two classes - one for deployment, the other - for folding. in these classes specify the position and background image. when collapsing / expanding, add / delete these classes. - LeD4eG
    • Found a mistake. It consisted in the fact that I did not have an element with ID bottonHead, but there was a class. - ZooMka