Skip to content

Instantly share code, notes, and snippets.

@kewang
Created December 11, 2016 16:39
Show Gist options
  • Save kewang/d21efb73fa0a79926dc71c28b27b2de5 to your computer and use it in GitHub Desktop.
Save kewang/d21efb73fa0a79926dc71c28b27b2de5 to your computer and use it in GitHub Desktop.
$(function(){
$(".hide-form-title").click(function(){ // 點選 title 的時候
$(this).siblings(".hide-form").slideToggle(function(){ // 找出同一層的 hide-form,然後開關
var img = $(this).siblings(".hide-form-title").find("img"); // 然後再找回原來 title 裡面的 img
var src = img.attr("src"); // 把 src 找出來
if (src === "images/down-arrow.png") { // 做上下箭頭的切換
img.attr("src", "images/up-arrow.png");
} else {
img.attr("src", "images/down-arrow.png");
}
});
});
});
@kewang
Copy link
Author

kewang commented Dec 11, 2016

Javascript

  • 全部換成這邊的程式碼

CSS

  • 不用調整

HTML

  • L29, L33:from -> form
  • <h3 class="hide-form-title">Inquiry Content <img src="images/down-arrow.png"></h3> 換成 <h3 class="hide-form-title">Inquiry Content <img src="images/up-arrow.png"></h3>
  • <div class="contact-information"> 再拉出來一層,很難用程式碼直接解釋

Image

  • 記得要放 up-arrow.png 到 images 目錄

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment