Question

我正在使用http://finnrudolph.de/ImageFlow/Examples进行imageFlow，当我调整窗口大小时，较小的图像变得非常小，因为它们的计算方式。我认为改变但没有成功，有什么建议吗？

this.refresh = function()
{
    /* Cache global variables */
    this.imagesDivWidth = my.imagesDiv.offsetWidth+my.imagesDiv.offsetLeft;
    this.maxHeight = Math.round(my.imagesDivWidth / my.aspectRatio);
    this.maxFocus = my.imageFocusMax * my.xStep;
    this.size = my.imagesDivWidth * 0.5;
    this.sliderWidth = my.sliderWidth * 0.5;
    this.scrollbarWidth = (my.imagesDivWidth - ( Math.round(my.sliderWidth) * 2)) * my.scrollbarP;
    this.imagesDivHeight = Math.round(my.maxHeight * my.imagesHeight);

    /* Change imageflow div properties */
    my.ImageFlowDiv.style.height = my.maxHeight + 'px';

    /* Change images div properties */
    my.imagesDiv.style.height =  my.imagesDivHeight + 'px'; 

    /* Change images div properties */
    my.navigationDiv.style.height =  (my.maxHeight - my.imagesDivHeight) + 'px'; 

    /* Change captions div properties */
    my.captionDiv.style.width = my.imagesDivWidth + 'px';
    my.captionDiv.style.paddingTop = Math.round(my.imagesDivWidth * 0.02) + 'px';

    /* Change scrollbar div properties */
    my.scrollbarDiv.style.width = my.scrollbarWidth + 'px';
    my.scrollbarDiv.style.marginTop = Math.round(my.imagesDivWidth * 0.02) + 'px';
    my.scrollbarDiv.style.marginLeft = Math.round(my.sliderWidth + ((my.imagesDivWidth - my.scrollbarWidth)/2)) + 'px';

    /* Set slider attributes */
    my.sliderDiv.style.cursor = my.sliderCursor;
    my.sliderDiv.onmousedown = function () { my.MouseDrag.start(this); return false;};

    if(my.buttons)
    {
        my.buttonPreviousDiv.onclick = function () { my.MouseWheel.handle(1); };
        my.buttonNextDiv.onclick = function () { my.MouseWheel.handle(-1); };
    }

    /* Set the reflection multiplicator */
    var multi = (my.reflections === true) ? my.reflectionP + 1 : 1;

    /* Set image attributes */
    var max = my.imagesDiv.childNodes.length;
    var i = 0;
    var image = null;
    for (var index = 0; index < max; index++)
    {
        image = my.imagesDiv.childNodes[index];
        if(image !== null && image.nodeType == 1 && image.nodeName == 'IMG')
        {
            this.indexArray[i] = index;

            /* Set image attributes to store values */
            image.url = image.getAttribute('longdesc');
            image.xPosition = (-i * my.xStep);
            image.i = i;

            /* Add width and height as attributes only once */
            if(my.firstRefresh)
            {
                if(image.getAttribute('width') !== null && image.getAttribute('height') !== null)
                {
                    image.w = image.getAttribute('width');
                    image.h = image.getAttribute('height') * multi;
                }
                else{
                    image.w = image.width;
                    image.h = image.height;
                }
            }

            /* Check source image format. Get image height minus reflection height! */
            if((image.w) > (image.h / (my.reflectionP + 1)))
            {
                /* Landscape format */
                image.pc = my.percentLandscape;
                image.pcMem = my.percentLandscape;
            }
            else
            {
                /* Portrait and square format */
                image.pc = my.percentOther;
                image.pcMem = my.percentOther;
            }

            /* Change image positioning */
            if(my.imageScaling === false)
            {
                image.style.position = 'relative';
                image.style.display = 'inline';
            }

            /* Set image cursor type */
            image.style.cursor = my.imageCursor;
            i++;
        }
    }
    this.max = my.indexArray.length;

Answer 1

您可以在图像上设置最小宽度。例如：

img {min-width: 200px;}

调整大小时的图像流滑块图像宽度和大小

1 个答案: