jQuery: image doesn't load when using a asp.net masterpage

Question

I'm stuck on this and it's pretty wierd.

First, this part works perfect when I place it on a blank .aspx page. On mouse hover, alert msg pops up and then the image turns blue.

<script type="text/javascript" src="../../Scripts/SelectCanvas.js"></script>
<asp:Image ID="imageMain" runat="server" ClientIDMode="Static" Height="300px" 
    Width="300px" />

---

(jquery code is in SelectCanvas.js)

$("#imageMain").hover(
function () {
    alert("main");
    $("#imageMain").prop("src", "../../images/selectCanvas/blue.gif");
});

I put the same image control in an .aspx file that uses a masterPage. Both .aspx files are in the same directory and both reference the same jQuery file. However, on mouse over, the alert msg pops up, but then the image does not turn blue ... ???

I've spent 1/2 day on this and am at a loss on this quirk ... tips are greatly appreciated ... thanks.

Answer 1

@ahmadali: .prop() works ... I left it in my code and it works fine ...

SOLUTION:

This was time consuming and a bit painful to discover ... LOL ...

I changed the Virtual Path (click on website/project name in the solution explorer and the Virtual Path is in the properties box).

By default, VS uses the project name: /myProject

I changed this to: /

---

So it makes sense on why the alert message was coming up (jQuery is working) but the image was not being found. It was because the Virtual Path was screwing up the path to the image.

I still don't understand why this is a problem (when using a MasterPage) while it isn't a problem when not using a MasterPage. But at this point, I'm just glad to get over this bump ... ;-x

Answer 2

it's $(el).attr("",""); not $(el).prop("","");!

you should use this code insted

$("#imageMain").hover(
function () {
    alert("main");
    $("#imageMain").attr("src", "../../images/selectCanvas/blue.gif");
});

there isn't any .prop() method in jquery. you could use inspect element tool of chrome and see the errors to find out what the error is!