*

flashを使わないスライドのサイト作ってみました

今更感もありますが、HTML5の初歩とJSでメインイメージのスライドを作ってみたくてサイトを試作しました。
架空のちょっとお高めなイタリアレストランを想定。
メニューに海外で流行ってたリボンを取り入れて、暖色の深い赤で高級感と食べ物にあった色あいに。
メイン画像の隣にでるボタンを押すと画像がスライドします。設定しだいでは自動スクロールも可能。

技術的にはスライドさせるボタンの位置をIE6で微調整できなかった。
間にタグを挟むと動作しなくなった。ie6はいいかな~と放置。

html5は、古いブラウザでもタグを読み込むスクリプト(Easy HTML5 Template)と付属のリセットCSSのためか、画像の下に余白がでました。とりあえずline-heightで調整しました。

使用したスクリプト
[JS]シンプル!高性能!超軽量!使い勝手の良いコンテンツスライダーのスクリプト -jContent

PR

関連記事

no image

建設会社のサイトを1ページにすっきりまとめると…

■内山建設 http://www.uchicc.co.jp/#index ・ぱっと見 落ち着いた

記事を読む

no image

自己紹介に最適!1カラムでスクロールするシングルページ

ちょっと前に1ページで完結するサイトのデザインが海外で流行ってました。 なので、自分も試しに自己

記事を読む

no image

各地方の美少女を集めたサイト

http://www.bishoujo-zukan.jp/ 一時話題だった美少女図鑑。 素人の

記事を読む

no image

学校など教育系のウェブサイトその2

その1はこちらです。 引き続き、2011年あたりで気になった、主に学校など教育系のサイトを紹介

記事を読む

no image

デジタルで使える定番無料色彩ツール

デザインは形と色の組み合わせと昔からいわれてます。 色彩に関する知識や法則はウェブデザインにももちろ

記事を読む

no image

【1週間分おまとめ】WEBサイトのぶくま#36~ゆらゆら遊べる、セクシーな配色、写真が引き立つサイト色々~

今回は盛り沢山です 時計にマウスを乗せると情緒ある仕掛けが 是非サイトへ!水面のようなゆらゆ

記事を読む

no image

楽しくなるアイデアのWEBデザイン

http://www.monogoen.jp/ ミスチルジャケットなどのデザインを手がける森本

記事を読む

no image

広告・ウェブ系の楽しさと会社サイトのかっちりさとのバランスの参考に

http://www.hakuhodody-inter.co.jp/ ・ぱっと見 ナチュラルな配

記事を読む

no image

【1週間分おまとめ】WEBサイトのブックマーク#31~コーディネーターヒデキ、気になるフォント、パララックスのアイデア~

ロゴもそうだけど遊び心のあるサービスですね。 シーン別も探しやすいし、 コーディネーターさんのコメ

記事を読む

no image

ウィジェットを使わずtwitterをデザインして表示

忘備録的な記事です。 ツィッターのウィジェットは簡単に設置できるけど デザインを合わせづらいんですよ

記事を読む

PR

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


PR

no image
ムームードメイン

新たにドメインを取得することにしました。 コスト重視でサーバーは

ルーベンス デッサン模写

アトリエでの課題制作

色彩検定の復習しながらイラスツ

お久しぶりの更新です。 せっかく色彩検定を取ったので、 錆

イラスト フリー素材 円満退社

検索用のタイトルで始まりましたが、 イラスト素材を公開しますー!

更新情報で記事のカテゴリータグを色別で表示【WORDPRESS】

ワードプレスの記事です。 ビギナー向けですが、ネットにちらばって

→もっと見る

PAGE TOP ↑