*

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

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

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

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

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

PR

関連記事

no image

なんか楽しい人物イラスト、カシスカラーの街、黄金町のアートサロンちっくなお店~WEBサイトのぶくま#49~

この人のイラスト好きなんです!なんて名前なんだろう。 カシスカラーの街のイラストがいい!

記事を読む

【1週間分おまとめ】WEBデザインの人気記事#20~フラットまとめ、リラックスできるネイチャーなサイトに素材やチュートリアル~

『今年流行りのフラットなデザイン制作に役立つCSSフレームワークやPSD素材まとめ8つ』 フラット!

記事を読む

no image

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

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

記事を読む

no image

配色センスとパララックス効果(視差効果)

CSSだけで実装されることもあるパララックス効果。 下記のサイトはflashで作られてますが、 その

記事を読む

最近見た中でほんとのお気に入りサイト3つ

ここ最近で、特に素晴らしいなと思ったサイトを紹介しますね。 技術ではなく、コンテンツ主体な傾向はあり

記事を読む

no image

なごむ旅のキャラ・良い感じの落書き+コラージュデザイン・水彩で爽やかに・おしゃれな写真の海外サイト~WEBサイトのぶくま#55~

優しい雰囲気。言葉にアイデアのある企画 みかんのサイト。オレンジは元気になりし、色の量も良い感

記事を読む

no image

【1週間分おまとめ】WEBサイトのぶくま#35~女の子向け、目を引く色彩、ルービックキューブに砂嵐~

柔らかなトーン イラストが良い感じ。こちらも女性向けかな。 ルービックキューブのようにごろ

記事を読む

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

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

記事を読む

no image

ストッキングブランドでWEBサイトでの商品の見せ方を知る

http://www.relish-style.net/ 今回は、女性向け商品サイトを一つの

記事を読む

no image

夏向けのスッキリクールなアイデアサイト

丸の内SUPERCOOLBIZ 丸の内の皆さんが夏をどう涼しく過ごすか!とアイデアをだしている

記事を読む

PR

Message

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

CAPTCHA


PR

no image
ムームードメイン

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

ルーベンス デッサン模写

アトリエでの課題制作

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

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

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

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

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

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

→もっと見る

PAGE TOP ↑