locked
jQuery effect is not working on Image control RRS feed

  • Question

  • User-1166428634 posted

    Hi All,

    I want to apply jQuery effect (any) to an Image which is inside a ListView Control. I tried to display "Hello" message for testing purpose it is displaying. But effect is not working. If see the View Source from the Browser it shows me id as "CPHMain_ListView1_AdImageLabel_0". Yes ofcourse, this is my ContentPage / Child Page. My ListView control's page is a part of Master Page.

    Any one help me here.

    Thanks

    Saturday, January 16, 2016 1:26 PM

Answers

  • User475983607 posted

    Hi All,

    I want to apply jQuery effect (any) to an Image which is inside a ListView Control. I tried to display "Hello" message for testing purpose it is displaying. But effect is not working. If see the View Source from the Browser it shows me id as "CPHMain_ListView1_AdImageLabel_0". Yes ofcourse, this is my ContentPage / Child Page. My ListView control's page is a part of Master Page.

    Any one help me here.

    Thanks

    It is always helpful to post the relevant source code.   I assume the difficulty is selecting the image element.  Use the ClientID of the server control to render the control ID in the script response.

    $('#<%=AdImageLabel.ClientID%>')

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, January 16, 2016 2:23 PM
  • User61956409 posted

    Hi Shailendra,

    Firstly, as mgebhard said, you could attach the jQuery effect to Image control by using ClientID.

    Besides, you could specify CssClass for Image control, then you could find the elements by Class selector and attach the jQuery effect to matched elements.

    Best Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, January 18, 2016 6:34 AM

All replies

  • User475983607 posted

    Hi All,

    I want to apply jQuery effect (any) to an Image which is inside a ListView Control. I tried to display "Hello" message for testing purpose it is displaying. But effect is not working. If see the View Source from the Browser it shows me id as "CPHMain_ListView1_AdImageLabel_0". Yes ofcourse, this is my ContentPage / Child Page. My ListView control's page is a part of Master Page.

    Any one help me here.

    Thanks

    It is always helpful to post the relevant source code.   I assume the difficulty is selecting the image element.  Use the ClientID of the server control to render the control ID in the script response.

    $('#<%=AdImageLabel.ClientID%>')

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, January 16, 2016 2:23 PM
  • User-698989805 posted

    Please check this out:

    http://www.aspdotnet-suresh.com/2013/04/jquery-zoom-image-on-mouseover-using.html

    http://forums.asp.net/t/1965826.aspx?Thumbnail+ListView+with+hover+effect+Jquery+Pluggin+

    Besides I've made a simple sample here. Try this out with ListView:

    <script language="javascript" type="text/javascript" >
       $().ready(function () {
           $("img").mouseover(function () { $(this).width(300); $(this).height(340) });
           $("img").mouseleave(function () { $(this).width(100); $(this).height(100) });
       })
    </script>
    
    
    <asp:ListView ID="ListView1" runat="server">
       <ItemTemplate>
          <asp:Label ID="lblID" runat="server" Text='<%# Eval("ProductID")%>'></asp:Label>
       </ItemTemplate>
    
       <ItemTemplate>
          <img src='<%# "../ProductImages/" & Eval("MainImage")  %>'  width="100"  height="100"/><br />
                       <%-- <asp:Image ID="img" CssClass="we" runat="server" ImageUrl='<%#"~/ProductImages/" & Eval("SmallImage")  %>'/><br>--%>
       </ItemTemplate>
    </asp:ListView>

    Saturday, January 16, 2016 2:55 PM
  • User61956409 posted

    Hi Shailendra,

    Firstly, as mgebhard said, you could attach the jQuery effect to Image control by using ClientID.

    Besides, you could specify CssClass for Image control, then you could find the elements by Class selector and attach the jQuery effect to matched elements.

    Best Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, January 18, 2016 6:34 AM