jQueryのポップアップの問題

Question

私はビューティーサロン用にTMから購入したテンプレートからサイトを作成しています！

私は名前番号サービスの種類の検証をオンライン予約フォームを作成したいが、私はそれはまた、

私はこれをどのように修正すればよいのhtmlのしないjqueryのを使用してポップアップ表示されます開くためのリンクを取得してトラブルを抱えています。 ..あなたが "今すぐ予約"をクリックすると、jqueryのポップアップがページの中央に表示され、その上に予約フォームが表示されるように、コードを挿入する必要があります....

私はグーグルでグーグルではありますが、jqueryのNOOBのように私にとってまったく新しいものです。

ここではテンプレートのライブデモです

（デモhttp://osc4.template-help.com/wt_31562/index.html#のテンプレートリンク）

、ここでは私がポップアップjqueryの

<dt class="dt3"><a href="#"></a><img src="images/shadow.png" alt="" class="shadow"></dt> 
<dd id="page3"> 
    <div class="inner"> 
    <div class="content"> 
     <section class="col-1"> 
     <h2>our services</h2> 
     <p>Vintage Beauty</p> 
     <p class="dark">We offer Free Consultation for Botox, Fillers, Medical Skin Peels, Cosmetic Surgery 
      <br> & also specialise n body and skin care. 
      </p> 
     <img src="images/page2-img1.png" alt="" class="p2"> <a href="#" class="more">view more</a> </section> 
     <section class="col-2"> 
     <h2>services</h2> 
     <ul class="list p2"> 
     <li><a href="#">Fish Pedicures</a></li> 
      <li><a href="#">Manicures</a></li> 
      <li><a href="#">Pedicures</a></li> 
      <li><a href="#">Waxing</a></li> 
      <li><a href="#">Threading</a></li> 
      <li><a href="#">Tanning</a></li> 
      <li><a href="#">Body Massage</a></li> 
      <li><a href="#">Nail/Eye Extensions</a></li> 
      <li><a href="#">Eye Lash/Brow Tinting</a></li> 
      <li><a href="#">Twinkle Toes</a></li> 
      <li><a href="#">Teeth Whitening Kits</a></li> 
      <li><a href="#">Hot Wax Specialists</a></li> 
     </ul> 
     **<a href="#" class="more">BOOK ONLINE NOW</a> </section>** 
    </div> 
    </div> 
</dd> 

Answer 1

を配置しようとしていますどこ私は何でもダイアログのポップアッププラグインあなたがサポートはiframeを使用していることを前提とするためのコードです。プラグインのWebサイトを見つけて、ドキュメントページを調べて、そうであるかどうかを確認してください。そうでない場合は、google： 'jquery plugin lightbox'、十分なオプションを見つけることができます。

ここにはぎこちなさがあります： ダイアログボックスでhtmlを表示しようとしている場合、通常これを達成する最も良い方法はiframeを使用することです。本質的に、iframeは最初のhtmlページを表示しているだけです。だからあなたがする必要があるのは、ポップアップに表示させたいフォームのhtmlページを作成し、iframeを使ってそのページにリンクするだけです。

iframeでw3schoolチュートリアルを見ると、このプロセスの仕組みを理解するのに役立ちます。

これを実装する限り、ライトのプラグインのマニュアルを参照して、スクリプトの仕組みを知る方法がないため、ヘルプを参照する必要があります。