-1

有人可以建议如何添加图像路径 tp jQuery 吗?我试图将此脚本中的彩色框替换为实际的真实图像,我现在使用 C: 作为我在本地工作。

理想情况下,我希望在屏幕上一个接一个地出现 5 张图像,但是我希望这些图像是可点击的,并且当点击时转到特定的 URL。

这可能吗?

谢谢

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").fadeIn();
    $("#div2").fadeIn("slow");
    $("#div3").fadeIn(3000);
    $("#div4").fadeIn(5000);
    $("#div5").fadeIn(7000);
  });
});
</script>
</head>
   <body>
    <p>Demonstrate fadeIn() with different parameters.</p>
    <button>Click to fade in boxes</button>
    <br />
    <br />
    <div id="div1">
        <img src="images/myimage1.png" alt="about" width="304" height="228"/>
    </div>
    <div id="div2">
        <img src="images/myimage2.png" alt="about" width="304" height="228"/>
    </div>
    <div id="div3">
        <img src="images/myimage3.png" alt="about" width="304" height="228"/>
    </div>
    <div id="div4">
        <img src="images/myimage4.png" alt="about" width="304" height="228"/>
    </div>
    <div id="div5">
        <img src="images/myimage5.png" alt="about" width="304" height="228"/>
    </div>
</body>
</html>
4

4 回答 4

0

正如您概述的那样,有几个问题可以使这项工作:

首先(正如其他答案所提到的),您需要将图像放在项目中(例如,在本地和服务器上工作的相对路径)。

其次,您没有提供任何 CSS,但要进行淡入,首先需要隐藏 div。

第三,您可以将 更改为window.location从代码转到另一个页面,或者只是将图像包装在锚点中。我在以下 JSFiddle 上提供了每种类型的示例:

JSFiddle在这里:http: //jsfiddle.net/TrueBlueAussie/nHk3k/4/

当我按下按钮时,它看起来像这样:

在此处输入图像描述

如果您不使用锚点,您还希望使用这两种样式在 div 上使用手形光标(用于跨浏览器支持):

   cursor: pointer;
   cursor: hand;
于 2013-09-17T11:27:18.803 回答
0

将 display:none 样式添加到您的 div

于 2013-09-18T05:20:57.973 回答
0

您无法从本地路径获取图像。因为浏览器将从客户端打开。因此您无法从本地计算机文件夹中获取图像。您需要将图像存储在服务器路径上并从服务器路径中检索它。

在您的项目中创建文件夹并将图像存储在该文件夹中,以便您在启动服务器时可以从项目中访问它。

于 2013-09-17T09:58:51.033 回答
0

您应该使用相对图像路径。为您的项目创建目录结构。例如 c:\myProject。将图像目录添加到其中 (c:\myProject\images)。然后你可以使用这样的路径:

<img src="images/myimage.jpeg" alt=""\>
于 2013-09-17T10:01:07.933 回答