php - 将 jquery 应用于 php 生成的图片列表

Question

我正在尝试制作可用作幻灯片放映的 tgis j 查询脚本，我生成图片列表

当我点击 li 项目时，通过 php 列表保持垂直向左，它变大并移动到我点击的同一个地方

现在它只是让 li 项目变大了。需要添加/调整什么

$(document).ready(function(){

$("div#dynamiclist_product table tr td img#thumb").click(function(){
$("div#dynamiclist_product table  tr td  img#main_pic").hide(); //hide prev pic that is loded automaticaly on product page
// enlarge when clicked
$(this).css("height","700");
$(this).css("width","500");
$(this).css("margin-top","170");//dont seem to work
$(this).css("margin-left","170");//dont seem to work

});});

//shrink back when other is clicked
$("img#thumb").click(function(){
$("img#thumb").css("height","160");
$("img#thumb").css("width","120");
$("img#thumb").css("margin-left","0");
$("img#thumb").css("margin-top","0");
});

Answer 1

不确定，但您需要为边距声明添加一个“px”。代替

$(this).css("margin-top","170")

做

$(this).css("margin-top","170px")

也许这就是它不会改变的原因，有时您甚至可以尝试使用 !important 标签，也许它已被其他一些 css 类覆盖。

更新

<div id="wrapper">
    <div id="thumbnails" style="float:left;">
        <ul>
            <li><img src="...." /></li>
            <li><img src="...." /></li>
            <li><img src="...." /></li>
            //....
        </ul>
    </div>
    <div id="big pic">
        <p><img src="...:" /></p>
    </div>
</div>

也许是这样的。并用一些jquery替换大的img src。