2

レスポンシブWebサイトの制作を目指しています。特定の JavaScript、つまりナビゲーション jquery をモバイル バージョンでのみ実行し、別のナビゲーション jquery を同じ要素のデスクトップ バージョンで実行したいと考えています。RespondJS ( http://responsejs.com/ ) と Media Check ( https://github.com/sparkbox/mediaCheck ) に出会いました。それらが正しい解決策であるかどうかわかりませんが、誰かが私に提案をしてもらえますか?

私は次のようなものを探しています:

<script>

(some code to check if desktop) {
   $(".navigation").runDesktopNavstyle();
   $(".slideshow").runDesktopSlideshow();
}

(some code to check if tablet) {
   $(".navigation").runTabletNavstyle();
   $(".slideshow").runTabletSlideshow();
}

(some code to check if mobile) {
   $(".navigation").runMobileNavstyle();
   $(".slideshow").runMobileSlideshow();
}

</script>
4

2 に答える 2

0

携帯電話やデスクトップなどに応じて、さまざまな形式の JavaScript を提供することはお勧めしません。メンテナンスの悪夢になる可能性があり、レスポンシブとはまったく異なります。モバイル用に別のサイトを用意することもできます。場合。

ただし、Bootstrap を使用すると、レスポンシブ クラスを要素に適用し、jQuery を使用してそれらのクラスを探して選択することができます。これは、同じ JavaScript ファイルを提供していることを意味しますが、必要な要素を処理するときにもう少しインテリジェントにします。たとえば、次のようになります。

<div class="visible-phone">
</div>

<div class="visible-desktop">
</div>

<script type="text/javascript">

$('.visible-phone').length > 0) {
   // Do phone stuff
}

$('.visible-desktop').length > 0) {
   // Do desktop stuff
}

</script>

非常に大雑把ですが、アイデアはわかります。

于 2013-06-11T13:59:16.137 に答える