質問: ### 前提・実現したいこと いつもお世話になっています。 初めての投稿になります。 Kindleで小説を読むように、横長で画面いっぱい縦書きのWebサイトを作成しています。 現在は手動で横スクロールが可能な状態なのですが、要素をクリックすることでページをめくるように表示されている画面幅だけ横(右から左方向)に移動させたいと思っているのですが、js、jqueryともに上手くいかず...。 ちなみに画面幅はCSSのvhとvwで指定しています。 同じように画面の幅をjsかjqueryで取得しながら、なおかつボタンクリックすることでoverflow-x:scroll;を指定した要素を横にスクロールさせたいのですが...。 「ページトップへ戻る」のような仕組みかと思い色々と試したのですが、横向きに移動させる方法が分からず質問させていただきました。 ![イメージ説明](https://teratail.storage.googleapis.com/uploads/contributed_images/6455199edf900a9115a6a8f694adba23.gif) コメントでご指摘いただいた例での動作結果はこちらになります。 ![イメージ説明](https://teratail.storage.googleapis.com/uploads/contributed_images/26f2af3ae227bb8e6536774a83cde04d.gif) ``` $(function() { $(".navigate-left").click(function(){ $('.container_single').css({left: "100%"}) }); }); ``` 僕の力量では難しく、アドバイスを頂きましたが悪戦苦闘しております。 具体的なコードがありましたら載せていただけると大変嬉しく思います。 よろしくお願いします。 もし解決されたら、横向きになりながらコーラ一気飲み余裕なぐらい元気でます。 ### 発生している問題・エラーメッセージ ``` エラーメッセージ ``` ### 該当のソースコード ``` ソースコード ``` ### 試したこと ここに問題に対して試したことを記載してください。 ### 補足情報(FW/ツールのバージョンなど) ここにより詳細な情報を記載してください。
回答: Squishyさんがjsの処理をどの程度出来るのかが分からないのですが ボタンのクリックイベントで下記の処理などで移動します ``` $('要素').css({left: "100%"}) ``` 追記 移動する領域を作ればいいですよ 言葉では難しいので分かりやすい参考サイトあったので貼っておきますね コピペして、動きを確認して、構造(?)を確認してみてください jqueryでsliderを自作するなら