移動響應能力，可在網絡上使用，不適用於移動設備

Question

我有一個網站girlsjustwannahavefont.com

網站即將完成，但功能在移動設備上值得懷疑。 當我在移動設備上單擊“查看我的進程”按鈕時，它不起作用嗎？ 但它在網絡上運行良好。 任何HTML，CSS，JavaScript都可以闡明為什么會發生這種情況嗎？ 需要說明的是，該按鈕在Safari上或在我的iPhone上經過測試時不起作用。

這是模式的CSS代碼。

.modal {
  background-color: $yellow;
  z-index: 300;
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  box-sizing: border-box;
  padding: 20px 0px 100px 100px;
  color: $black;
  display: none;
}

這是單擊該按鈕時要執行的JavaScript代碼。

$('.link').click(function() {
  m.id = $(this).attr('data-id');
  $('body').css('overflow', 'hidden');
  $("div[data-id=" + m.id).slideDown();
});
$('.close').click(function() {
  $("div[data-id=" + m.id).slideUp();
  $('body').css('overflow', 'auto');
})

Answer 1

有一個永遠不會關閉的開放式括號，可能是問題所在：

("div[data-id=" + m.id)

嘗試

("div[data-id=" + m.id + "]")

在所有事件處理程序中