jquery と javascript を使用せずにサイトを開発する方法を教えてください。
現在、jquery サイクル プラグインを使用して開発されたカルーセルがありますが、「Web for all、プログレッシブ エンハンスメントを使用する」と信じてサイトを実装する必要があるという考えを変更したため、良いように思えますが、どのように変更するのかわかりません。 JavaScript が無効になっている場合に実行する既存のカルーセルとアコーディオン。
これらのカルーセルとアコーディオンを JavaScript を使用せずに、または最小限の JavaScript を使用して実行する必要があります。css3 と html5 のみを使用しているため、javascript がオフの場合でもユーザーは表示できます。現在、javascript がないと、アコーディオンが壊れ、すべてのコンテンツが表示され、カルーセルが動かなくなります。
JS を使用せずに既存のカルーセル、アコーディオンを実行する方法について、いくつかのアイデアを探しています。
前もって感謝します。
あなたの答えを待っています。
Web サイトでのインタラクティブ性は、CSS と Javascript によって提供されます。Javascript を無効にすると、すべての対話操作を CSS で行う必要があります。
CSS3 は確かにカルーセルを生成できます。いくつかの例については、 http://speckyboy.com/2010/06/09/10-pure-css3-image-galleries-and-sliders/を参照してください。純粋な CSS3 カルーセルのウォークスルー (ドイツ語ですがわかりやすい) は次のとおりです。
それでも、これは素晴らしく、Javascript を持っていない人にとっては問題を解決しますが、CSS3 をサポートしていない古いブラウザーを使っている人にとっては同じくらい多くの問題を引き起こします...
上司に、Javascript を使用していない、CSS3 を使用していない、カルーセルが好きではない、またはインターネットを使用していない人が常にいることを伝えてください。誰でもアクセスできるようにサイトを作成することはできません。コストとメリットを考慮して、妥当なオプションを選択してください。
私自身、CSS3 フォールバックを備えた Javascript はほとんどの人にとってうまく機能すると思います :)
幸運を！
css3 トランジション、トランスフォーム、および :active 疑似クラスを確認する必要があります。
トランジション: http://www.alistapart.com/articles/understanding-css3-transitions/
変換: http://24ways.org/2010/intro-to-css-3d-transforms
疑似クラス: http://coding.smashingmagazine.com/2011/03/30/how-to-use-css3-pseudo-classes/
すべての画像を一度に表示するか、javascript を使用したくない場合は ie6 などのブラウザーで 1 つの静止画像を表示することになります。