サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
ノーベル賞
niwakasoft.jp
今回はJQueryの記事になります。まさに、上のメインキャッチでやっているのですが、リピート表示させた背景画像をエンドレスで動かしたいなと思いネット上で探してみました。すると ツーブロッカさん の記事が見つかりましたのでこちらを参考にスクリプトをいじってみました。
webサイトを作るにあたり、HTMLをどう記述するのがBESTなのか?CSSはどう記述するのがBESTなのか?悩むことが多々あるのではないかと思います。今回はGoogleが推奨しているHTML/CSSコーディングルールを抜粋してご紹介していこうと思います。既に数多のwebサイトで紹介されてしまっていますので個人的に「そうだったの!?」と思った項目に焦点を合わせようと思います。 ちなみに、 Googleガイドライン こちらが本家です。 プロトコル http/httpsのそれぞれのファイルを両方のプロトコル上で利用できない場合を除き、画像やその他のメディアファイル、スタイルシート、およびスクリプトを指しているURLからプロトコルを省略する事が推奨されています。 <!-- 非推奨 --> <script src="http://www.google.com/js/gweb/analytics/a
先週に引き続き「Animate.css」を使った要素が動きまくりなwebの作成方法です。前回は「Animate.css」と「Ani.JS」を組み合わせることでアニメーションのトリガーを設定し「オンマウス時」や「クリック時」にアニメーションを発動させる方法をお伝えいたしましたが、今回は「Animate.css」と「wow.js」を組み合わせることによりアニメーションのトリガーを「スクロールが要素に達したら実行する」方法をご紹介していきます。 ちょっと言葉だけだと分かり難いので、まずはサンプルサイトをご覧になられて下さい。(※初回読み込み時はブラウザに要素が表示されるスピードより先にアニメーションしてしまうと思うので、一度更新されてみてください)順次ご説明いたしますが、サンプルサイトでは「単純にスクロールが要素に達した時」以外のトリガーも設定しているため少しオーソドックスな設定とは違いますので
今回はCSS3のみを使い、雪が降る背景の作成の仕方をご紹介します。 参考にさせて頂いたのはコチラの海外サイトです。 今回の記事はCSS3のアニメーション等をフルに活用するのでIE9以下は動作しませんのであしからず・・・。 完成サンプルはコチラ!! まずは降らせる雪の透過ピングを作成、または下記のサンプルからダウンロードされて下さい。
不動産系のサイトや、求人媒体系のサイトでよく見かける、地図画像上の県や地域毎にリンクを設定して、オンマウスで該当範囲が切り替わるアニメーションを今回は作成して行こうと思います。※今回の記事はアドビの画像編集ソフトをフル活用いたします。主にフォトショップ(イラストレーター・ファイヤーワークスでも可)を使用致しますので該当ソフトが無い方は申し訳ありません。 まずは下のサンプルを御覧ください、それぞれの県の上でオンマウス時に画像が切り替わっていると思います。 このサンプルの地図のように「四角」で区切られたリンク領域であればドリームウィーバーで完結出来てしまいますが、例えばディフォルメされていない正確な地図にクリッカブルマップを作成したい場合などに力を発揮することができます。それでは早速作成手順の紹介です!! フォトショップ等で地図として使用したい画像の作成 画像は2枚必要になります。 元画像 オ
意外と融通の効かないWPのカテゴリ構成今回はワードプレス関連の記事になります。WP案件の中で、右の画像のようなカテゴリ構成の状態で親カテゴリID1とID5は別ページで、それぞれのページで所属している子カテゴリ含めてそのカテゴリの新着情報一覧を作成しようとしていました。もしかするとプラグインで同等の事がサクっと出来てしまうかもしれませんが、公式でない場合マルウェアに感染するリスクや他のプラグインとの相性なども有るため今回はphp手書きでの対応の紹介となります。 早速、親カテゴリID1の最新記事一覧を作っていきます。出力の際に「日時」「カテゴリ名」「タイトル」といった具合に出力し「カテゴリ名」は所属する親カテゴリ名で出力しようと思っています。右のイメージは完成図です。
このページを最初にブックマークしてみませんか?
『NIWAKASOFT株式会社』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く