HTML/CSS наведение мыши на кнопку для отображения нижнего колонтитула

Question

Итак, для моего проекта я установил фиксированный верхний и нижний колонтитул, но заметил, что мой нижний колонтитул довольно большой. То, что я хотел бы сделать, это скрыть его и добавить кнопку внизу, чтобы при наведении курсора отобразился весь нижний колонтитул.

Вот мой текущий сайт: http://webcomp41.volume11.com/final/index.html

Как бы идти о добавлении этой функции? Любая помощь очень ценится!

Answer 1

CSS Решение: (показать/скрыть полностью)

для того, чтобы работать, вам просто нужно сделать кнопку и нижний колонтитулы братья

#footer 
{ 
    display: none; 
} 
#button:hover ~ #footer 
{ 
    display: block; 
} 

вы можете использовать ту же технику, чтобы указать другой размер вместо show/hide.

и как Али Шейхпур сказал: уведомление: замените слово «кнопка» на ID кнопки и «нижний колонтитул» с идентификатором нижнего колонтитула.

Пример HERE

Answer 2

JQuery решение:

$("#button").hover(function(){$("#footer").show()}) 

уведомления: заменить слово «кнопка» с идентификатором кнопки и «сноской» с идентификатором сноски.