【重要】サービス終了のお知らせ

Forked from: takahiro.nakamori's BootstrapのCarouselを少し改造する View Diff (32)

Fork
2
Fav
0
View
3539
  • Play

Fullscreen

Smart Phone

Fork tree

  • Readme
  • JavaScript 102 lines
  • HTML 46 lines
  • CSS 69 lines
BootstrapのCarouselを少し改造(その2)

PC版では固定幅表示で、スマホ版では幅100%で表示するパターン。


画面幅が768px未満の場合
画像幅 :100%
画像高さ:160px
で表示

画面幅が768以上、992px未満の場合
画像幅 :100%
画像高さ:240px
で表示

画面幅が992px以上、1200px未満の場合
画像幅 :940px
画像高さ:345px
で表示

画面幅が1200px以上の場合
画像幅 :940px
画像高さ:345px
で表示

画像は幅や高さに合わせて画像のサイズを変更し、常に中央を基準に表示するよう画像の位置も調整する。

元の画像は、幅:940px、高さ:345px
  • BootstrapのCarouselを少し改造する(2)
  • bootstrap.js 3.0.0
  • jQuery v1.11.0
  • BootstrapのCarouselを少し改造する(2)
  • bootstrap.css 3.0.0

play

Complete!

Description What kind of game?

Control Device

jsdo.it websocket controller

Mouse

keyboard

smartphone

Fullscreen

takahiro.nakamori

Author

IT関係の仕事をしています。休日はバードウォッチングをしたり、 写真を撮ったり、洋菓子作り(ケーキ・シュークリーム・焼き菓子など)をしたりしています。

Default Panel

Size

  • Width: px
  • Height: px

code

QR Code

Discussion

Questions on this code?

Tags

Forked

sort by