SIRIUSでJavaScriptを使ったスマホサイトを作成

siriusでスマホサイトの作成がどうしてもうまくいかない。

iphonサイト同時作成にしているし、プレビューではちゃんと表示される。
しかし、自分でスマホで見てみた際にPC版と同じサイトが表示される。

コレはこれでいいのだが、やはりせっかくなので、スマホサイトもしっかり作りたい。

何がいけないのか、悪戦苦闘しながらたどり着いた結論。

「これ、テンプレートがおかしんじゃね。」もしくは、<head></head>の部分はスマホで同時生成されないんじゃないか。 「SIRIUSでJavaScriptを使ったスマホサイトを作成」の続きを読む…

flexsliderで矢印の画像を表示するCSSを編集しよう

flexsliderでよく悩むのは、何と言っても「前へ」「次へ」の矢印だろう。

自分もさんざん悩んだのが、やっと一段落ついた。

自分がやった事は、好きな矢印の画像を使って矢印を固定し、ついでにスライダーの本体も多少修正した。

flexsliderのJavaScriptのは修正するのは危険だし、それほど必要がないので、主な修正箇所は、スタイルシートだろう。

これがまた厄介で分りにくい。

そこで、今回はflexsliderのスタイルシート(CSS)の修正に的を絞って説明していく。 「flexsliderで矢印の画像を表示するCSSを編集しよう」の続きを読む…

jqueryを使おう


今時ホームページを作ろうと思ったら、JavaScriptはほとんど必須と言ってもいいくらい浸透してきた。

Javascriptを使う上で、絶対に外せないのがjqueryだ。

実はこのjqueryとても便利で、よく使うJavaScriptに記述するfunctionをあらかじめ作ってくれているのだ。
これは使わない手はない。
というか、JavaScriptでやろうとしてることは、ほとんどこれだけで、できるような気がする。

ちょいちょい忘れるので、記述の仕方をまとめておこうと思う。
ほとんど自分のためなんだが、悩んでる人の役に立てばいいな。 「jqueryを使おう」の続きを読む…

ホームページにスライダーを実装しよう

ホームページにスライダーを挿入したくて色々試したが、flexsliderに落ち着きそう。

bxsliderも手軽でいいんだが、どうもサムネイルに現在選択中の画像がわかるようにするには、自動でスライドできないという結論に至った。

要は自動でスライドするか、サムネイルに現在選択中とわかるようにするかの2択になってしまう。

そこで今度はflexsliderにしてみたら、一発で解決された。

しかし、デフォルト状態だと使いにくいのでいくつか変更が必要となる。

①まず、cssを編集 「ホームページにスライダーを実装しよう」の続きを読む…

ホームページ作成の裏技3

スライダーを実装

手順1

jquery・bxsliderのjsとcssのファイルを読み込む

<!– jquery読み込み –>
<script type=”text/javascript” src=”//code.jquery.com/jquery-1.11.1.min.js”></script>
<!– bxSlider java script file –>
<script src=”http://new-fever.xyz/js/jquery.bxslider.min.js”></script>
<!– bxSlider CSS file –>
<link href=”http://new-fever.xyz/js/jquery.bxslider-aki.css” rel=”stylesheet” />

jqueryは1回読み込んでたら読み込む必要なし

手順2
「ホームページ作成の裏技3」の続きを読む…