jbox 图片的放大与缩小

html代码

 <div class="table-box">
        <table style="border:none;">
            <thead>
            <th class="name">图片</th>
            <th class="name"></th>
            <th class="name"></th>
            <th class="name"></th>
            <th class="name"></th>
            <th class="name"></th>
            </thead>
            <tbody>
            <tr>
                <?php $i = 0;foreach ($pictures as $pic): ?>
                <?php if ($i==6): ?>
            </tr>
            <tr>
                <?php $i = 0; endif; ?>
               <td>
                   <img src="<?php echo $pic['picturepath'];?>" alt="<?php echo $pic['picturetype']; ?>" style="height:80px;width:80px;cursor:pointer" onclick="javascript:CallJbox('<?php echo $pic['picturepath'];?>','<?php echo $pic['picturetype']?>',500,450)"/>
                </td>
                <?php $i++;endforeach; ?>
            </tr>
            </tbody>
        </table>
    </div>
//弹窗显示界面
    function CallJbox(url,title) {
        html = "<img style='width:500px;height:450px' src='" + url + "'/>";
        $.jBox(html, {
            title:title,
            width: 500,
            height: 450,
            iframeScrolling: 'yes',
            buttons: {}
        });
    }

 

posted on 2015-09-21 11:38  勤奋者努力着  阅读(260)  评论(0编辑  收藏  举报

导航