이북 사이즈 수정(소스링크첨부)
관련링크
본문
이북소스를 하나 구했는데요
사이즈를 1100*1700 으로 변경 하고 싶은데 높이를 1000px 이상으로 설정하면 사이즈가 재 멋대로 변합니다
어디를 수정해야 하는지 조언좀 부탁드립니다
답변 2
<div id="features" class="wowbook" style="height: 319px; width: 510.4px; margin: auto;">
이 부분에서 자동으로 사이즈가 조절되고 있습니다.
자바스크립트에 의해서 자동으로 사이즈가 조절되는 것입니다.
id="features" class="wowbook" 이곳의 값을
초기 설정 값은 아래의 자바스크립트에서
지정됩니다.
<script type="text/javascript">
$(document).ready(function() {
$('#features').wowBook({
height : 500
,width : 800
,centeredWhenClosed : true
,hardcovers : true
,turnPageDuration : 1000
,numberedPages : [1,-2]
,controls : {
zoomIn : '#zoomin',
zoomOut : '#zoomout',
next : '#next',
back : '#back',
first : '#first',
last : '#last',
slideShow : '#slideshow',
flipSound : '#flipsound',
thumbnails : '#thumbs',
fullscreen : '#fullscreen'
}
,scaleToFit: "#container"
,thumbnailsPosition : 'bottom'
,onFullscreenError : function(){
var msg="Fullscreen failed.";
if (self!=top) msg="The frame is blocking full screen mode. Click on 'remove frame' button above and try to go full screen again."
alert(msg);
}
}).css({'display':'none', 'margin':'auto'}).fadeIn(1000);
$("#cover").click(function(){
$.wowBook("#features").advance();
});
var book = $.wowBook("#features");
function rebuildThumbnails(){
book.destroyThumbnails()
book.showThumbnails()
$("#thumbs_holder").css("marginTop", -$("#thumbs_holder").height()/2)
}
$("#thumbs_position button").on("click", function(){
var position = $(this).text().toLowerCase()
if ($(this).data("customized")) {
position = "top"
book.opts.thumbnailsParent = "#thumbs_holder";
} else {
book.opts.thumbnailsParent = "body";
}
book.opts.thumbnailsPosition = position
rebuildThumbnails();
})
$("#thumb_automatic").click(function(){
book.opts.thumbnailsSprite = null
book.opts.thumbnailWidth = null
rebuildThumbnails();
})
$("#thumb_sprite").click(function(){
book.opts.thumbnailsSprite = "images/thumbs.jpg"
book.opts.thumbnailWidth = 136
rebuildThumbnails();
})
$("#thumbs_size button").click(function(){
var factor = 0.02*( $(this).index() ? -1 : 1 );
book.opts.thumbnailScale = book.opts.thumbnailScale + factor;
rebuildThumbnails();
})
});
</script>
그리고 나서 모든 것은
wow_book.min.js 이곳에서 class가 wowbook 인 곳에서 컨트롤 되어집니다.
답변을 늦게 봤네요
index.html 에서
<script type="text/javascript">
$(document).ready(function() {
$('#features').wowBook({
height : 1100
, : 1750
처럼 수정했는데 width를 1000 이상으로 잡으니까
전체 사이즈가 리사이즈가 되버리면서 비율이 유지 되는데요
width를 1000 이하로 줄이면 높이 1100으로 정상으로 보이구요
제가 정확히 이해를 못한거 같긴한데 언급해주신
<div id="features" class="wowbook" style="height: 319px; width: 510.4px; margin: auto;">
이 부분은 어디에 있는건가요?
그리고 어디를 정확히 수정해야 높이1100*가로1700 으로 변경할 수 있는건지 답변 부탁드립니다