2014-01-01から1ヶ月間の記事一覧

【 jQuery 】 jQuery Filtering かっこいい画像配置 切り替え

jQueryを使って、jQuery Filteringというかっこいい画像配置、切り替え方法を紹介します。 ポートフォリオにも利用できるのでおすすめです。今回は画像サイズを100px X 100px で作っていますが簡単にカスタマイズできるので試してみて下さい。DEMO_PAGE jQue…

Webサイト簡単実装 ( HTML5, CSS3, jQuery, JavaScript )

Webサイトを簡単に実装できるようにするサイトをまとめてみました。 HTML5, CSS3, jQuery, JavaScriptを自分のサイトに実装するのにご利用下さい。Webサイト簡単実装 ( HTML5, CSS3, jQuery, JavaScript ) - NAVER まとめ

【HTML5, CSS3】 jQueryやJavaScriptを使わないCSS3だけで作るロールオーバー

HTML5とCSS3だけで作るロールオーバーを紹介します。 このロールオーバーは一切jQueryやJavaScriptを使っていません。まず始めに、画像の素材がないときに、画像の仮置きのスペースを確保する方法を紹介します。 やり方はいたって簡単。 img src="" の部分を…

【ECサイト】 BASE 無料で利用できるショッピングカート

ECサイトを作る際、BASEという無料で利用できるショッピングカートを紹介します。BASAは無料で利用できるショッピングカートで、決済方法も、クレジットカード、代引き、銀行振り込みと選べます。 さらにテーマやヘッダー画像、背景もカスタマイズできるので…

【CMS】 Joomla!

CMSのJoomla!について紹介します。ご存知の方は多いと思いますがJoomla!とはオープンソースで無料で配布されているCMSで、海外では多くの人に利用されています。 アクセス制限をかけるサイトなど、初心者でも比較的安易に作れることから人気があるようです。…

【HTML5】レスポンシブデザイン テンプレート

HTML5でレスポンシブデザインのレイアウトテンプレートを作りました。是非ご参考までに。 【index.html】 <html class="ie9" lang="ja"> </html>

【HTML5, jQuery】 タブメニュー

HTML5でjQueryを使ったタブメニューテンプレートを紹介します。画像と文章を変えるだけで簡単にカスタマイズできますので、 是非チャレンジしてみては。画像は各自用意して下さい。 【index.html】 <html lang="ja"> <head> <meta charset="UF-8"> <title>タブメニュー</title> <link rel="stylesheet" href="style.css"> </link></meta></head></html>

【 Wordpress 】カナダ • カルガリーのブロガーさん ワードプレスブログ

Wordpressを使って、『カナダ • カルガリーのブロガーさん』というブログを始めました。プラグインなどはまだほとんど入れていないですが、これからはWEB情報とともに、カナダ•カルガリーの情報を発信していきたいと思います。もしよろしければご覧下さい。h…

【 jQuery, CSS3 】 マウスオーバーで画像が回転するプラグイン

jQueryとCSS3を使って、マウスオーバーすると画像が回転するプラグインを紹介します。このjQueryはgoogle、safari、firefoxで動作確認済みです。 webkit-や-moz-の具合によって動作しなかったりするので、編集する際には注意が必要です。 【index.html】 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title></title></meta></head></html>…

【jQuery、CSS】background-imageを利用した効果

DEMO_PAGE Beautiful Background Image Navigation jQueryとCSS だけで簡単にホームページトップがオシャレになります。 サンプルは飲食店をイメージして作成しました。 バックグラウンドイメージで画像を配置しているのがポイント! jsファイルはDEMO_PAGE…

HTML5でグリッドレイアウト サンプル(IEでも対応)

HTML5でグリッドレイアウト サンプル IEでも対応しています。 HTML5とCSSだけでこのように画像を配置できます。 floatの特性を生かしてチャレンジしてみて下さい。 私の場合は画像を3列に分けることで、レイアウトしやすくしています。 行ごとに分けても可能…