Мне нужно изменить код javascript

Question

Я сделал onclick всплывающее окно redmore для моего бокового текстового виджета в Wordpress только что скопировано и вставил этот код. Я нашел here. Я немного изменился, и все сработало нормально.

Проблема возникла, когда мне пришлось сделать больше всплывающих окон onclick, подобных этому для остальных виджетов боковой панели, точно такое же всплывающее окно с одинаковыми значениями, но с другим текстом img и content.

Проблема в том, как «redmore» кнопки в первом виджете и во втором одной ссылки на одно и то же - так будет открыть тот же, независимо от того, какая кнопка redmore нажатии кнопки -

this is the website ЗАКАНЧИВАТЬ первые два элемента в правой боковой панели.

Поскольку я не очень разбираюсь в Javascript, я спрашиваю вас, можете ли вы помочь мне изменить ссылку на теги javascript в коде, чтобы ссылаться на другое всплывающее окно, а не одно и то, что я могу понять как изменить его, так как я должен сделать несколько всплывающих окон.

Answer 1

Вы должны изменить атрибут Id Содержимого для например

<div id="light2" class="white_content"> 
<div id="fade2" class="black_overlay"> 

для второго всплывающего и изменить JavaScript второго чтения больше текста

<a href = "javascript:void(0)" onclick = "document.getElementById('light2').style.display='block';document.getElementById('fade2').style.display='block'">here</a> 

То же следует применять для всех других всплывающих окон.

Здесь я изменил fiddle

Answer 2

Вы должны изменить идентификатор для каждого всплывающего окна Как

getElementById('fade') 
getElementById('light') 

[первый]

getElementById('fadesec') 
getElementById('lightsec') 

[второй]
И так далее ..
же на содержание HTML, не копировать, изменять идентификаторы

Пример 2:

<p>This is the main content. To display a lightbox click <a href = "javascript:void(0)" onclick = "document.getElementById('lightsec').style.display='block';document.getElementById('fadesec').style.display='block'">here</a></p> 
    <div id="lightsec" class="white_content">This is the lightbox content. <a href = "javascript:void(0)" onclick = "document.getElementById('lightsec').style.display='none';document.getElementById('fadesec').style.display='none'">Close</a></div> 
    <div id="fadesec" class="black_overlay"></div>