문제

I'm showing different types of images on a site. Attached to every image I want to add some text. I have written this text in the title-element in the html document. This text is a few sentences long.

What happens now is that the fancybox becomes really narrow (since the picture is quite small) and the text looks really stupid. I've tried to change the width and height values within the fancybox code, but it still doesn't seem to work. I tried to fix it in css too, and I got the title text to become wider, but the fancybox was still too narrow, so the text was partly within AND outside to box.

How can I change the fancybox size to a fixed size so that the title text won't look so visually stupid?

So far I have done this:

jQuery:

$(".fancybox").fancybox({
    helpers : {
        title: {
            type: 'inside',
            position: 'top',
        }
    },
            openSpeed: 'slow',
            closeSpeed: 'slow',
});

CSS

.fancybox {
    width: 600px;
    height: 600px;
}

.fancybox-title {
  width: auto;
  height: auto;
}

.fancybox-title .child {
  min-width: auto; 
  height: auto;
}
도움이 되었습니까?

해결책

You can use:

$(".fancybox").fancybox({
    autoDimensions: true
});

Read the doc: http://fancybox.net/api

다른 팁

You Need to set autoSize to false

$(".fancybox").fancybox({'width':400,
                         'height':300,
                         'autoSize' : false});
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top