我正在尝试使用ContentFlow javascript(http://www.jacksasylum.eu/ContentFlow/index.php)设置一个简单的幻灯片放映,并且我知道我缺少一些非常简单的东西-我似乎无法控制幻灯片中图像的大小。它会自动将它们缩放到我正在查看它们的设备上,但是在高分辨率的显示器上,它看起来太小了。

这是设置的一部分:

<link rel="stylesheet" type="text/css" href="ContentFlow/contentflow.css" />
<script type="text/javascript" src="ContentFlow/contentflow.js" load="slideshow"></script>

<script>
ContentFlowGlobal.setAddOnConf('slideshow', {startOnLoad: true, duration: 4000});
    </script>

<script>
{
        duration : 2000,   //ms
        startOnLoad : true,
        showControlls : true
    }
    </script>


这是幻灯片的正文部分:

    <div class="addon">
        <div class="flowBox" style="">
            <div id="ContentFlow_slideshow" class="ContentFlow" useAddOns="slideshow">
                    <!-- should be place before flow so that contained images will be loaded first -->
<div class="loadIndicator"><div class="indicator"></div></div>


    <div class="flow">

        <div class="item">
            <img class="content" src="images/1.jpg"/>
            <div class="caption">Something<br/><a href="#">by Test</a></div>
        </div>
        <div class="item">
            <img class="content" src="images/2.jpg"/>
            <div class="caption">Something<br/><a href="#">by Test</a></div>
        </div>
        <div class="item">
            <img class="content" src="images/3.jpg"/>
            <div class="caption">Something<br/><a href="#">by Test</a></div>
        </div>
        <div class="item">
            <img class="content" src="images/4.jpg"/>
            <div class="caption">Something<br/><a href="#">by Test</a></div>
        </div>
        <div class="item">
            <img class="content" src="images/5.jpg"/>
            <div class="caption">Something<br/><a href="#">by Test</a></div>
        </div>

    </div>
    <div class="globalCaption"></div>


如果有人可以指出一个具有控制幻灯片大小的代码的示例,或者提供一些代码示例,我将不胜感激!

最佳答案

浏览options(然后是项目),看起来可以将scaleFactor:添加到初始化中。

如果您希望它首先计算窗口大小并提出比例公式(1 = 100%),则必须在开始流程之前先进行以下操作:

<script type="text/javascript">
var scale = 2 // or some formula based on window size
ContentFlowGlobal.setAddOnConf('slideshow', {startOnLoad: true, duration: 4000}, scaleFactor:scale);
</script>

关于javascript - 配置ContentFlow时出现问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/3770738/

10-12 02:21