ここから本文です

本のようなWebページを作りたいのですが…… Web製作初心者です。 タイトルの通...

min********さん

2017/12/1707:46:40

本のようなWebページを作りたいのですが……

Web製作初心者です。
タイトルの通り、ページ全体が本のようなサイトを作りたいと思っています。

色々調べてみて、個人的にFullscreen Pagefli

p Layoutというプラグインがイメージに近く、コードも扱いやすかったのですが、唯一、厚紙をめくるようなエフェクトが気に入らず、かといって他のプラグインはイマイチ使いこなせなかったので、行き詰まってしまいました。

質問ですが、

・画面いっぱいにかけられて
・ページ内リンクで動作し
・ペラッとめくれる

上記のようなサイトを実装できそうな方法があれば、教えていただきたいです。

htmlとcssは扱えます。
jQueryは微調整程度、触れただけです。

切実なので、どうかお力を貸してください。

閲覧数:
102
回答数:
2
お礼:
50枚

違反報告

ベストアンサーに選ばれた回答

sor********さん

2017/12/2121:43:02

Fullscreen Pageflip Layout のコードを自分で改修するのが一番速いはずです。

ちゃんと読めばページめくりの動作の部分の記述が見つかるはずなのでそこを微調整します。


https://tympanus.net/codrops/2012/12/11/fullscreen-pageflip-layout/


普通に検索すればFullscreen Pageflip Layout のページめくりは jScrollPane と言うライブラリを使っていると判別します。


私はJavaScriptは全く書けませんし残念ながら書いた事も無いですが、コードのどこをいじればページめくりのエフェクトが変わるのかは検索し始めて数分(2分とか)で分かりましたよ?

OSSなんてこんな程度なんでガチガチに考えなくても良いかと。

素人でも該当するパラメータをパラパラと弄ってれば何とかなるものです。

この回答は投票によってベストアンサーに選ばれました!

ベストアンサー以外の回答

1〜1件/1件中

oishii_mahouさん

2017/12/1711:09:38

配布されているプラグインで探すなら、
「Javascript ページめくり プラグイン」とかで検索すると、
こんな感じの記事がいくらでも出てくる。

https://webdesignmagazine.net/javascript/jquery-plugin-page-flip-bo...

ぺラッとめくれるものも結構あるけど、
プラグインの設定で全画面化ができるかどうかは1つ1つ見てないんで、
どの程度のカスタマイズができるかは、
プラグインの使い方の部分をみれば分かるはず。


--------------------------------------


本のページめくりなら、
単に HTML 要素のクリッピングや位置変化などを
Javascript でコントロールするだけなんで、
配布されているプラグインで納得できない動作がある場合は、
いちから自分で作った方が早くて良いものが作れると思う。

配布されているプラグインの動作の一部が気に入らなくて
プラグインの内部をいじって改造しようとすると、
まずはプラグインを構成する
スクリプトのファイルのコード全文を解読してから、
周りの動作を壊さないように処理内容を書き換えないといけないんで、
自分でいちから作った方がはるかに楽で満足度も高い。
配布プラグインのコードなんて、
そもそも人に見せるために書いてるコードじゃないから、
たいてい読みにくいものばかりなんで、
それを読み解くだけでも相当にめんどい。

Javascript の基本文法をマスターして、
あとは自分の理想の動作になるように処理を計算する頭があれば、
そこそこの労力で作れる。
見つからないものを探し続けるよりは楽しいし、
納得の程度も配布物とは比べ物にならない。

ちょっとの納得のいかない仕様に目を閉じて妥協するか、
これを機に Javascript を覚えていちから作ってみるか、
どっちかだと思う。

もし自作を目指すなら、
jQuery からやるとバグにつまずいて余計に時間と手間がかかるんで、
ふつうに Javascript の基本を覚えていったほうがいい。
jQuery は Javascript のコードを楽して書けるように短縮したもので、
そもそも jQuery 自体が Javascript でできている。
コードの長さは jQuery の方が短いが、
やれることや自由度や処理効率が高いのは生の Javascript。
Javascript の基本が分かっていれば、
jQuery なんて勉強しなくても使えるし、
jQuery で楽をするには最低 Javascript の知識が必要。

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる