OnMouseOver текст отображается каждый раз, когда вы открываете страницу

Question

Я получил проект, где Текст должен быть отображается Если я парить над картиной. Он отлично работает для отображения и отображения части, но проблема, с которой я сейчас сталкиваюсь, заключается в том, что если я начну страницу, она будет отображаться. Если я буду навис над ним, и он будет работать снова. С этого момента он остается невидимым, но в начале он отображается.

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

Для части JS я использовал .style.visiblity= "visible"; and "hidden";

для HTML части я использовал новый <div> для самого текста с: style="visibility:none;"

<div class="responsive"> 
    <div id="picture1" class="img" > 
     <img src="../picture1" alt="picture1" width="600" height="400" onmouseover="funcOver('picturetext')" onmouseout="funcOut('picturetext')"> 
     <div class="desc" style="font-family: Luminari;">HOLIDAY</div> 
     <div id="picturetext" style="visibility:none;"> This is a photo<br> 
     of our holiday. </div> 
    </div> 
</div> 

JS:

function funcOver(x) 
    { 
     document.getElementById(x).style.visibility = "visible"; 


    } 

function funcOut(x){ 

    document.getElementById(x).style.visibility = "hidden"; 
} 

Answer 1

ли вы попробовать использовать свойство OnLoad для элемента?

OnLoad event - W3CSchools

Или CSS Дисплей:

CSS Display visibility