-1

有以下代码：

 <script language="javascript" type="text/javascript">
 function SetImageName(strName)
 {
 document.getElementById("ImageName").value = strName;
 }
 </script>

 <form>
 <div id="slideshow">
 <div id="Container">
 <div id="Images">
            <img src="images/image1.jpg" name="image1.jpg" onclick="SetImageName(this.name)"/>
            <img src="images/image2.jpg" name="image2.jpg" onclick="SetImageName(this.name)"/>
            <img src="images/image3.jpg" name="image3.jpg" onclick="SetImageName(this.name)"/>
            <img src="images/image4.jpg" name="image4.jpg" onclick="SetImageName(this.name)"/>
            <img src="images/image5.jpg" name="image5.jpg" onclick="SetImageName(this.name)"/>
            <div id="slideEnd"></div>
          </div>
        </div>
    </div>
        <input type="hidden" value="" id="ImageName" name="ImageName"/></form>

用户可以从列表中选择图像。想要预览用户选择的图像。喜欢

 You are selected image is
 <?
 $image = $_POST["ImageName"];
 echo ('<img src="'.$image.'" />');
 ?>
4

3 回答 3

1

请尝试以下方法：

<html>
<head>
<title>sample</title>

<style type="text/css">
.hover_image a{
position:relative;
}
.hover_image a span{
position:absolute;
display:none;
z-index:99;
}
.hover_image a:hover span{
display:block;
}
</style>
</head>
<body>
<div class="hover_image">
<a href="#">Links text <span><img src="image.png" alt="image" height="100" /></span></a>
</div>
</body>
</html>

将任何图像名称 image.png 放在相关目录中并将文本悬停在页面上以查看图像。

您可以编辑它以满足您的需要。

于 2013-03-22T09:58:41.677 回答
0

这将适用于你..Enjot 它。我在这个练习中使用了 jQuery。

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
    $(document).ready(function()
    {
        $('div').click(function() {
            var image = $(this).text();
            $("#showImage").html("<img src='your_path/"+image+".png'>");
            // do something with the text
        });
    });
</script>
<div id="image1" >Image1</div>
<div id="image2" >Image2</div>
<div id="image3" >Image3</div>
<div id="image4" >Image4</div>

<div id="showImage"></div>
于 2013-03-22T10:11:35.567 回答
0

好的，那么你可以这样做：

  1. 添加您的代码：- 为每个 img 标签添加标题属性，删除名称属性
  2. 为要在单击事件中显示的标题属性赋予值

  3. 现在添加此代码

    <script>
$(document).ready(function()
{
    $('img').click(function(){  
        var nameImg = $(this).attr('title');
        alert("you have selected "+nameImg);  
    });
});

此代码将提醒图像的名称如果您想在其他 div 中显示此名称，则添加一个 id 为“selectedImgTag”的 div 并用此代码替换上面的代码 -

<script>
        $(document).ready(function()
        {
            $('img').click(function(){  
                var nameImg = $(this).attr('title');
                $("$selectedImgTag").html("you have selected "+nameImg);  
            });
        });
    </script>
于 2013-03-22T11:28:15.030 回答