2015-04-17 6 views
0

Я использую Wordpress, и я хотел бы иметь плагин, который позволит мне открыть окно/всплывающее содержимое для вызова «href». Что-то вроде этого: <a href="onclik open popup">Text</a> использовать его в сНу тегеСодержимое всплывающего окна, вызванное href

это код я использую:

<div class="tracklist download-button2" style="display: initial-block"> 
    <a href="#"> 
     <span class="header-clip2"> 
      <span class="header-triangle2"></span> 
     </span> 
     <span class="header-bg2"></span> 
     <div class="clear"></div> 
     <div class="file-icon-inner2"> 
      <i class="icon-download2"></i>Tracklist 
     </div> 
    </div> 

пожалуйста, проверьте http://af-sound.ro кнопку «Треклист» так, кто нажмет на Треклист, я хотел бы есть всплывающее окно с открытым содержимым.

Будет больше кнопок «tracklist», поэтому мне не нужно просто глобальное всплывающее окно. Я пробовал с всплывающим окном Anything, но это не работает, поскольку он использует короткий код, например: [anythingpupup = id1], который не может использоваться в вызове «a href»

ответ

0

Первая проблема заключается в том, что вам не хватает закрывающего якоря tag

Во-вторых, вы должны предоставить окно, в котором вы хотите открыть атрибут «id».

<div id="popup-box"></div> 

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

<a href="#popup-box">Click to open popup</a> 

«#» будет ссылаться на атрибут Идентификатор элемента набора.

Нет необходимости устанавливать весь плагин Wordpress. Вы можете использовать что-то вроде Bootstrap Modals

Инструкции очень просты, чтобы помочь вам настроить его.

0

Думаю, для этого вам не нужен плагин. Вы можете использовать только javascript, чтобы открыть такое всплывающее окно с якоря. Вот пример кода:

<a href="#" onclick="Popup();"> Open Popup! </a>   
    <script language="javascript"> 
     function Popup() 
     { 
      var win = window.open('', '',"toolbar=no, width=100, height=20"); 
      var doc = win.document.open(); 
      doc.write('<html><body> <b>Hello!</b> </body></html>'); 
      doc.close(); 
     } 
    </script> 

Как вы можете видеть, вы можете добавить любой динамический HTML как содержание всплывающего окна, в том числе HTML, который вы хотите в методе doc.write.

Cheers!

0

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

Возможно, самый простой способ не использует плагин; просто добавьте скрытый div с содержимым всплывающего окна. И затем, из jQuery, захватите щелчок вашего тега a и покажите, что скрытый div. Из CSS вы можете стилизовать этот div любым способом.

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

Смежные вопросы