復位DIV基於點擊的位置

我有一個頁面，包含多個，相同的隱蔽形式，每個包含在一個獨立的隱藏DIV這樣：復位DIV基於點擊的位置

HTML：

<div class="product-intro-text">Some text.... 
    <div class="rfq-button"><a class="advantage-button" id="Adapters" href="#">Request a Quote</a></div> 
    <div class="inline-rfq"> 
      <form class="contact" name="contact" action="#" method="post">...</form> 
    </div> 
</div> 
<div class="h-sep"></div> 
<div class="product-intro-text">Some text.... 
    <div class="rfq-button"><a class="advantage-button" id="Auger&nbsp;Equipment" href="#">Request a Quote</a></div> 
    <div class="inline-rfq"> 
      <form class="contact" name="contact" action="#" method="post">...</form> 
    </div> 
</div>

而不必所有這些的相同的隱藏DIV，我如何重新定位.inline-RFQ DIV出現在被點擊的相應.rfq按鈕下方？這是針對移動網站的，因此解決方案必須適合移動設備。我已經使用JS/JQuery的整個頁面的其餘部分，在這裏

是揭示隱藏的DIV的JS：

jQuery(document).ready(function($){ 
/* toggle form */ 
$(".rfq-button").on("click", function(){ 
    $(this).next().slideToggle(); 
    $(".inline-rfq").next().toggleClass("display"); 
}); 
});

感謝您的幫助提前。

來源

2012-12-19 Peter Susko

你想要這樣的東西嗎？ http://jsfiddle.net/Morlock0821/uDpUQ/ –

這裏有一個小提琴：你可能需要添加下一個新的部分出了當正在重置形式州http://jsfiddle.net/psyon001/ejdgX/ 一件事。

jQuery(document).ready(function($) { /* toggle form */ 
    $(".rfq-button").on("click", function() { 
     var $thisParent = $(this).closest('.product-intro-text'), 
      $form = $(".inline-rfq"); 
     if ($thisParent.find('.inline-rfq').length) { 
      $form.slideToggle(); 
     } else { 
      $form.slideUp(function() { 
       $form.appendTo($thisParent).slideDown(); 
      }); 
     } 
    }); 
});

來源

2012-12-19 15:07:34 Syon

感謝您的快速解決方案！完美的作品。 –

復位DIV基於點擊的位置

回答

相關問題