0

首先我要说:

多么神奇的软件啊!

精心设计、实施和记录,以及许多很酷的功能。

将其作为开源提供给了很多人!

现在我已经为“Gambio GX”-shopsystem(一个非常先进的 osCommerce fork)做了一个滑块实现。

你可以在这里看到它的实际效果:http: //marmorkamin-shop.de/Test/

我使用了所有可用的图像转换(377)和字幕动画(438),每张幻灯片都是随机选择的......

(导致 163,618(!)种不同的幻灯片更换方式......)

滑块是使用 PHP 动态生成的,基于商店数据库中的幻灯片信息....

由于内联样式在这样的环境中非常不灵活,我已将样式移至样式表。

它已经像一个魅力,几乎....

我遇到的两个问题:

标题区域有时会被剪裁(请参见这张图片中的第一个标题:截图

项目符号导航器中只有项目符号 1、2 和 3 处于活动状态,其他项目不响应。

知道这可能是什么原因吗?

再次感谢这个伟大的软件!

编辑:

标题区域有时会被剪裁(请参阅此图片中的第一个标题:屏幕截图)

同时为此找到了一个快速而肮脏的解决方案:

为标题元素分配clip: auto !important;CSS direktice...

但我相信一定有更好的解决方案:-)

4

2 回答 2

0

回复:字幕剪辑请始终指定字幕的宽度和高度。您可以在 css 文件中指定宽度和高度,

.slide_caption_1 {
    left: 100px; top: 200px; width: 110px; height: 29px;
}
.slide_caption_2 {
    left: 150px; top: 250px; width: 110px; height: 29px;
}
.slide_caption_3 {
    left: 200px; top: 300px; width: 110px; height: 29px;
}

你也可以指定内联样式,

<div class="jssor_slide_caption slide_caption_1" data-u="caption" t="*" style="width: 110px; height: 30px;"></div>

回复:项目符号问题未指定项目符号导航器“mousedown”的样式。给定导航器项目原型的类是'jssor_navigator_entry','active'状态的类名是'jssor_navigator_entryav','mousedown'状态的类名是'jssor_navigator_entrydn' 所以,请在slideshow.css文件中添加以下css代码。

.jssor_navigator_entrydn {
    padding: 5px 0px 0px; border: currentColor; border-image: none; width: 27px; height: 24px; text-align: center; color: white !important; font-weight: bold !important; text-decoration: none; margin-right: 0px; float: left; display: block; position: relative !important; z-index: 9; cursor: pointer; background-color: rgb(50, 22, 1);
}
于 2014-07-20T11:05:15.883 回答
0

这是一个以简单方式定义子弹导航器的示例,

<script>
    var jssor_options={
      ...
      $BulletNavigatorOptions: {                        //[Optional] Options to specify and enable navigator or not
        ...
        $SpacingX: 5,                                   //[Optional] Horizontal space between each item in pixel, default value is 0
        ...
      }
      ...
    };
<script>

<!-- Bullet Navigator Begin -->
<style>
    .the_navigator{
        position: absolute;
        bottom: 0px;
    }

    .the_navigator_item, .the_navigator_itemdn, .the_navigator_itemav {
        position: absolute;
        width: 27px;
        height: 24px;
        line-height: 24px;
        color: #fff;
        font-weight: bold;
        background-color: #321601;
        text-align: center;
        cursor: pointer;
    }

    .the_navigator_item:hover, .the_navigator_itemav {
        background-color: #d1013f;
    }
</style>
<!-- bullet navigator container -->
<div class="the_navigator" data-u="navigator">
    <!-- bullet navigator item prototype -->
    <div class="the_navigator_item" data-u="prototype"><numbertemplate></numbertemplate></div>
</div>
<!-- Bullet Navigator End -->
于 2014-07-20T11:42:07.590 回答