0

我有一个存储在我的文件中的图像。

我想以 3 种不同尺寸查看此图像。所以我使用<img src>标签并定义不同的高度和宽度 3 次。

当我只是回应它时,它工作得非常好。现在我想在滑块中查看它,并且在其中添加了 JavaScript 代码。

它适用于“拇指图像”,因为它带有<img src>标签,但小图像和大图像没有<img src>标签,我无法理解如何在两者中调整图像大小'smallimage:' &'largeimage:

我对 JavaScript 了解不多。我只是从其他地方复制了 JavaScript 代码。

<link rel="stylesheet" href="css/jquery.jqzoom.css" type="text/css">
<script type="text/javascript">

    $(document).ready(function() {
        $('.jqzoom').jqzoom({
            zoomType: 'innerzoom',
            preloadImages: false,
            alwaysOn:false
        });
    });
</script>


<table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
    <td align="right" valign="top" ><div class="clearfix" style="margin-left:-30px;">
        <a href="images/imgProd2/bracelets_Diamond.png" class="jqzoom" rel='gal1'  title="triumph" >         
            <img src='<?php echo $single_image_query_fetch['images']; ?>' height='261' width='325'  
                title='triumph'  style='border: 4px solid #666;'>            
        </a>
        </div>
        <br/>

      <!-------------------------------- Images Part is strating from here ------------------------->

        <div class="clearfix" style="margin-left:-30px; margin-top:-10px;" >
            <ul id="thumblist" class="clearfix" >

                $image_query = "select * from product_images where product_id=$id";
                $image_query_run = mysql_query($image_query);
                while( $image_query_fetch = mysql_fetch_array($image_query_run)) {

                    //Thumb                 
                    $thumb_image =
                        "<img src=http://localhost/cms/". 
                                $image_query_fetch['images'] ." height='80' width='100' alt=\"\" />";


                    //large
                    $big_image = "<img src=http://localhost/cms/". 
                            $image_query_fetch['images'] ." height='1024' width='1280' alt=\""/>";
                            $image_fetch[1]= $big_image;

                    //small                                 
                    $small_image = "<img src=http://localhost/cms/". 
                                    $image_query_fetch['images'] ." height='261' width='325' alt=\"\" />";
                <li>
                <a  href='javascript:void(0);' rel="{gallery: 'gal1', 
                                                        smallimage: 'images/imgProd2/Bracelet_Silver.png',
                                                        largeimage: 'images/imgProd2/bracelets_Diamond.png'}">
                        <img src='<?php echo $image_fetch[0]; ?>' height='80' width='100' >
                    </a>
            </li>
}

<li>我想为smallimage和定义尺寸largeimage。请告诉我该怎么做。

4

2 回答 2

1
$("smallimage").css('height', 'num_here');
$("smallimage").css('width', 'num_here');

$("largeimage").css('height', 'num_here');
$("largeimage").css('width', 'num_here');

我不知道是 largeimage 和 smallimage 还是 classes 或 id,所以你必须自己指定,假设你知道如何做到这一点......因为 jquery 文档中显示了 height 和 width 属性。不仅如此,这个问题在这里肯定被问了 100 多次。

于 2013-08-30T09:37:16.907 回答
1

是的你可以。

对于高度

$(".smallimage").height(100);

对于宽度

$(".smallimage").width(150);

将 100 和 150 更改为您的值或动态值...

干杯

于 2013-08-30T09:39:54.060 回答