Видимость JavaScript мигает

Question

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

В настоящее время при нажатии большого пальца средство просмотра отображается в видимости, а затем сразу же снова становится невидимым.Я хотел бы знать, как вызвать зрителя для полной видимости и затем сохранить его там.

Я использую внешний файл .js.

Событие onclick:

<div class="thumb_box">
    <a href="" alt="gallery thumb" onclick="invokeViewer()">
        <img class="thumbnail" src="../thumbs/jacob/jacob1.png"  />
    </a>
</div>

Функция JavaScript:

function invokeViewer(){

    var viewerBack = document.getElementById('imagebox_foreground');
    var viewerFore = document.getElementById('imagebox_background');
    var currentImage = document.getElementById('current_image');

    viewerBack.style.visibility='visible';
    viewerFore.style.visibility='visible';
    currentImage.style.visibility='visible';

    return false;
}

HTML-код модуля просмотра:

<div id="imagebox_foreground" style="visibility:hidden">
    <img id="current_image" style="visibility:hidden" src="imageurl.jpg" />
</div>

<div id="imagebox_background" style="visibility:hidden"></div>

CSS зрителя Div

#imagebox_foreground{
    position:absolute;
    left:50%; top:50%; 
    height:570px; width:880px; 
    margin-left:-430px; margin-top:-285px; 
    background-color:transparent; 
    z-index:992;
}   
#imagebox_background{
    position:absolute; left:50%; top:50%; 
    height:570px; width:880px; 
    margin-left:-430px; margin-top:-285px; 
    background-color:black; 
    border-right:solid 4px rgb(40,40,40); border-left:solid 4px rgb(40,40,40); 
    opacity:.85; filter:alpha(opacity=85); 
    z-index:991;
}           
#current_image{
    display:block; 
    margin-right:auto; 
    margin-left:auto; 
    margin-top:10px;
}

Answer 1

Я подозреваю, что ваш href срабатывает и ваша страница перезагружается.Добавьте return false в ваш обработчик событий, чтобы предотвратить запуск ссылки.invokeViewer() уже возвращает false, поэтому вы можете просто сказать return invokeViewer():

<a href="" alt="gallery thumb" onclick="return invokeViewer()">

или:

<a href="" alt="gallery thumb" onclick="invokeViewer(); return false;">