【覚え書き】visibility:hiddenとidの関係 / jQueryでレスポンシブによるコード切り替え

レスポンシブ・デザインで、mobile用とpc用のdivを
片方visible:hiddenにして解決するときの注意

コードのなかにidがあると、たとえそれがhiddenになっていても、「idがある」という情報は生きてしまうらしい。

よって、

<div class="for_mobile_only">
	<p id="hoge">mobile</p>
</div>

<div class="for_pc_only">
	<p id="hoge">pc</p>
</div>

こんな感じのコードがあって、片方のdivをcssでhiddenにしていても、
「1ページ中にidが２つ」という違反が起きてしまうっぽい。
jsがidを認識できなくなったりするので注意が必要だ。

---

なおjQuaryのレスポンシブ分岐方法は以下の通り

		//レスポンシブ分岐
		if (window.matchMedia("(max-width: 768px)").matches) {
			// windowのサイズが768px以下
			var answer_size = "5rem";
		}else{
			// windowのサイズが768px以上
			var answer_size = "2rem";
		}