首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >实现jquery全屏图像滑块yii 2项目

实现jquery全屏图像滑块yii 2项目
EN

Stack Overflow用户
提问于 2016-09-27 04:28:00
回答 1查看 137关注 0票数 0

我正在尝试在我的yii2项目中实现一个滑块,我上周开始使用yii我不知道我是否做了正确的事情,我下载了this代码,但我使用它的方式不是100%工作,图像和缩略图显示,但我不能点击缩略图来更改背景,原始代码工作正常,问题是我不能让它在我的yii项目中工作

代码语言:javascript
复制
<?php
$dataProvider = new ActiveDataProvider([
    'query' => Cake::find(),

]);
?>

<?= ListView::widget([
    'dataProvider' => $dataProvider,
    'itemView' => '_bolos',
    'summary' => '',
    'options' => [
        'tag' => 'div',
        'id' => 'gallery',
        'class' => 'bigImages',
    ],

]); ?>

_bolos:

代码语言:javascript
复制
<?php
use yii\helpers\Html;

/* @var $model \app\models\Cake */

?>

<script>
    <?php $this->beginBlock('page-script') ?>
    (function () {

        $("#gallery").fullscreenGallery();

    })();
    <?php $this->endBlock() ?>
</script>

<?php $this->registerJs($this->blocks['page-script']) ?>


<div id="gallery">
    <div class="bigImages">
        <ul>
            <li> <?= Html::img($model->cakePhotos[0]->getUploadUrl('file'), ['width' => '100%']); ?></li>

        </ul>
    </div>
    <div class="thumbnails">
        <ul>
            <li> <?= Html::img($model->cakePhotos[0]->getThumbUploadUrl('file')); ?></li>
        </ul>
    </div>

</div>
EN

回答 1

Stack Overflow用户

发布于 2016-09-28 23:44:24

小部件ListView将为将从$dataProvider检索到的每个Cake模型呈现_bolos.php视图。因此,您的页面将包含很少的#gallery div元素和js脚本(请参阅您的页面源代码)。因此它不能被正确初始化。

需要将所有不应重复的图元移动到主视图中。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/39711825

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档