特定のサイズの会社ラベルのスライドショーを作成したいと考えています。スクリプトcamera.js
を使用してスライドショーを作成し、画像サイズを変更する必要があります。
<link
rel='stylesheet'
id='camera-css'
href='/html/themes/classic/css/camera.css'
type='text/css' media='all'>
<style>
.fluid_container {
margin: 0 auto;
max-width: 1000px;
width: 100%;
}
</style>
<script>
jQuery(function(){
jQuery('#camera_wrap_3').camera({
height: '50%',
pagination: true,
thumbnails: false,
imagePath: '/html/themes/classic/images/'
});
});
</script>
<div class="fluid_container">
<div
class="camera_wrap camera_emboss"
id="camera_wrap_3">
<div
data-thumb="/thumbs/1.jpg"
data-src="/slides/1.jpg"
data-time="1500"
data-trasPeriod="4000"
data-link="some link here"
data-target="_blank">
<div
class="camera_caption fadeFromBottom">
some text here
</div>
</div>
<div
data-thumb="/thumbs/2.jpg"
data-src="/slides/2.jpg"
data-time="1500"
data-trasPeriod="4000"
data-link="some link here"
data-target="_blank">
<div
class="camera_caption fadeFromBottom">
some text here
</div>
</div>
</div>
</div>
<div style="clear:both; display:block; height:100px"></div>
ここにいくつかのスクリーンショットがあります。
の場合max-width == 400px
:
の場合max-width == 100px
:
サイズを変更するには?小さいコンテナが必要で、スライドは310x82
.