【问题标题】:JQModal problemsJQModal 问题
【发布时间】:2014-01-20 08:46:02
【问题描述】:

我使用 jqModal,我有图像,当我点击图像时需要更大图像的模态窗口。 我是这样设计的:

<div class="catalog-pages-image clearer clearfix">
            <?php foreach ($sorted as $page): ?>
                <a jqModal="id-<?php echo $page['value_id']; ?>" href="javascript:void(0)" title="<?php echo $this->htmlEscape($_product->getName()) ?>"
                   rel="<?php echo $this->helper('adaptiveResize/image')->init($_product, 'image', $page->getFile())
                       ->setCropPosition('center')
                       ->adaptiveResize(227, 318); ?>">
                    <img src="" height="318" alt="<?php echo $this->htmlEscape($_product->getName()) ?>"/></a>
                <div id="jqModal" class="jqmWindow" style="display: none">
                        <?php var_dump($page->getFile()); ?>
                </div>
            <?php endforeach; ?>
        </div>

jquery:

Query('#jqModal')
                    .jqm({overlay: 0, trigger: false})
                    //.jqDrag()

                jQuery('.catalog-pages-image').children().click(function () {
                    jQuery(jQuery(this).attr('jqModal')).jqmShow();
                });

CSS:

.jqmWindow {
    display: none;

    position: fixed;
    top: 17%;
    left: 50%;

    background-color: #EEE;
    color: #333;
    border: 1px solid black;
    padding: 12px;
}

.jqmOverlay { background-color: #000; }

我无法创建小提琴,原因是 PHP 的 foreach。

这可能是个问题:

jQuery(jQuery(this).attr('jqModal')).jqmShow();

【问题讨论】:

    标签: javascript jquery jqmodal


    【解决方案1】:

    试试这个:

     jQuery('.catalog-pages-image a').click(function () {
         jQuery(this).next().jqmShow();
     });
    

    【讨论】:

    • 感谢回复,但未捕获类型错误:无法读取未定义的属性“c”,只有第一个链接有效
    【解决方案2】:
    jQuery('.catalog-pages-image a').click(function () {
                        jQuery('#jqModal').html(jQuery(this).attr("rel"));
                        jQuery('#jqModal').jqmShow();
                    });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2010-10-10
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多