*

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

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

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

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

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

PR

関連記事

no image

構成・ビジュアル、どちらの導線も優れたサイト

http://vidal.jp/top.htm CMも流れていて、知名度のあるヴィダルサスーン

記事を読む

【1週間分おまとめ】WEBデザインの人気記事#21~グリッドレイアウトお助けツール、適度なノイズで集中力アップなサイト~

『PNGやPSDファイルとしてエクスポートできるグリッド生成ツール・「Modular Grid Pa

記事を読む

no image

自分好みのAKBメンバーが作れるサイト

アイスの実の商品紹介+キャンペーンサイトです。 広告代理店らしい仕掛けだったCG合成のAKBメン

記事を読む

2014の年賀状をウマく描く。【資料まとめ】

そろそろ年賀状の準備をし始める方も多いのではないでしょうか。 そこで、趣味も兼ねてオリジナルのもの

記事を読む

no image

AKB48が野菜の格好をしてくれちゃってるサイト

カゴメ 野菜一日これ一本 AKB48がそれぞれ野菜の格好をして、おすすめレシピを教えてくれ

記事を読む

no image

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

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

記事を読む

no image

いろんなジャンルの女性向けのサイトその2

前回の記事の続きです。 女性向けのサイトでデザイン的に優れたものをピックアップしました。 ブックマー

記事を読む

no image

WEBサイトのぶくま#44~タブレット風デザインや情報の整理の参考。~

エアメールのようなラインがキレイ 空の旅!イメージを半分後ろに敷くパターン エンドレスなバ

記事を読む

no image

【1週間分おまとめ】WEBサイトのぶくま#38~美しい水面の波紋のサイト、ここまでできるリボンのアート作品~

キャッチなど、目を引く力があるな~ 波紋が美しい。。是非サイトを御覧ください。必見! キレ

記事を読む

no image

「そうだ京都、行こう」はサイトも和風で良い感じ

http://souda-kyoto.jp/ ・ぱっと見 落ち着いた、品の良さがあるサイト。

記事を読む

PR

Message

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

CAPTCHA


PR

no image
ムームードメイン

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

ルーベンス デッサン模写

アトリエでの課題制作

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

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

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

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

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

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

→もっと見る

PAGE TOP ↑