5/11/2016

カルーセル導入秘話(その2)

前回以来
もうすっかり間が
あいてしまいました。

めげずに
更新!更新!

カルーセル
導入秘話の後編です。
結論は説明していないですよね。



このような方法を使うと
希望するカルーセルは
至極簡単に導入が出来ます (*´◇`*)
しかしながら、これは邪道、奥の手の手法です。 ・・

(  実はこの原稿は2ヶ月前に既に出来あがっていたのですが公開を忘れていました )


前回のおさらいです。

GOOGLEで 「カルーセル導入」を
検索すると、TOPに結論から言えば、
カルーセル無用論と導入慎重論が出てきます。 

これに対する僕の考えは

そんな事
聞きたくて
検索しているのではない

ワンワン!
です。



知りたいのは方法です。

そして、それなりに時間をかけて
PC検索のみで知識を得た僕(いぬです)が
それを元に説明をすると以下のとおりになります。
これが、方法。極々初心者向けのお話に
なりますが、その点は前回前置きしていますので お察しください。

1>カルーセルはこれで動く

凡そWEB上のhomepage、blog を
運営する方を対象にしたいのはやまやまなのですが、

今回はレンタルを含むサーバーを
持たない無料のブログを使用する方、(いぬ)を対象に
僕とほぼ同じ目線で話を進めていきます。

(画像1)


ブログを
構成するのは
基礎設計図の
テンプレートtemplate )と
その運転方法、色、形、大きさ、
速度を表示する
スタイルシートcss

からなります。










WEB上での約8割強のカルーセル導入に関する説明は
レンタルを含むサーバー保持者、しかも若干の知識のある方
対象に内容が展開しています。何故なら上に示した図解がありません。
また、css(スタイルシート)の導入はj Query関連のサイトから
ダウンロードする、で話を締めくくっているからです。

このダウンロードするcssが?

僕はこの点で最初に躓きました。
たとえば意図するように ダウンロードしても
中身は何のことやらさっぱりだからです。

また、前回にリンクしたいろんなサイトの掲載
html、cssをコピペしましたが、簡単には表示されません。


(画像1)のチャートを元に説明します。
今回のカルーセル導入は template 上の数字1、2、3
そして 4、もしくはcss を導入します (内容は下に記しました)。・・(A)

(画像2)

結論から言えば、
カルーセル
を動かすj Query に関しては
所詮知識のないいぬが何を
言っても始まらないので
<head>~</head>内に
そのJAVAを含めたものと、
リンクをコピペして貼るしか
ありません。

(大半のサイトの説明ではそのように指示)

それを省くと
(画像2)のような構図が
見えます。






意外に長文ですね(´・ω・`)。
一回 区切りましょう。

ここまでをまとめると以下のようになります。
詳細な説明は前回の参考サイトを 参照しましょう。
僕がするのは参照をもとにした結論ありきです。

------- woof !----------woof !----------------

カルーセルはこれで動く
カルーセルを導入する際の手順。上述の (A) を再度繰り返し
表示し、おさらいをしておきます。

▼1 j Queryのリンクを貼る。(ここにjQuery のJAVAを合わせて貼ることも)
▼2 <div id~>~</div>の表示形態( メインです )を貼る。
▼3 jQuery のJAVAを貼る。(ここにcssの内容を貼ることも稀にある)
▼4 色、形、大きさ、速度を表示する内容を貼る。もしくはCSSに同内容を貼る。



どれも
超~初心者には
易しい内容では
なかったです。

何度やっても
カルーセルが動かない!




時間だけが過ぎてゆく(´・ω・`)? (続く)