Image not showing : The Official Microsoft ASP.NET Forums

Reply

EssCee

Member

548 Points

Re: Image not showing

Nov 29, 2012 12:26 PM|LINK

Sorry im a little lost as to what changes i need to make. As for the image i decided to change the entire path to an image on the net to see if my code displays the image - but still doesnt :(

        <script type="text/javascript">
            $(document).ready(function () {
                // Handler for .ready() called. 
                var imgs = ['http://i.s-microsoft.com/global/ImageStore/PublishingImages/logos/hp/logo-lg-1x.png',
                'http://i.s-microsoft.com/global/ImageStore/PublishingImages/logos/hp/test.jpg'];
                var cnt = imgs.length;
                setInterval(Slider, 3000);
 
                function Slider() {
                    $('#imageSlide').fadeOut("slow", function () {
                        $(this).attr('src', imgs[(imgs.length++) % cnt]).fadeIn("slow");
                    });
                }
            });
        </script>

Edited by EssCee on Nov 29, 2012 12:27 PM

Reply

fayaz_3e

Star

9332 Points

1744 Posts

Re: Image not showing

Nov 29, 2012 12:35 PM|LINK

I tried your code and is working abs fine. Might be an issue with your image container...

Try accessing your image with different selector. Replace $('#imageSlide') with

$('img[id*=imageSlide]')

this.Fayaz();

Reply

EssCee

Member

548 Points

761 Posts

Re: Image not showing

Nov 29, 2012 12:47 PM|LINK

Thanks for your help but still no image.... My code is:

<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="TestSite.master.vb" Inherits="Test.TestSite" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server">
        <script src="../App_Themes/Test/jquery-1.8.2.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                // Handler for .ready() called. 
                var imgs = ['http://i.s-microsoft.com/global/ImageStore/PublishingImages/logos/hp/logo-lg-1x.png',
                'http://i.s-microsoft.com/global/ImageStore/PublishingImages/logos/hp/test.jpg'];
                var cnt = imgs.length;
                setInterval(Slider, 3000);
 
                function Slider() {
                    $('img[id*=imageSlide]').fadeOut("slow", function () {
                        $(this).attr('src', imgs[(imgs.length++) % cnt]).fadeIn("slow");
                    });
                }
            });
        </script>
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
        <div>
    Test
        <img id="imageSlide" alt="" src="" />
    </div>
    <asp:ContentPlaceHolder ID="cph" runat="server">
 
    </asp:ContentPlaceHolder>
    </form>
</body>
</html>

Reply

fayaz_3e

Star

9332 Points

1744 Posts

Re: Image not showing

Nov 30, 2012 05:28 AM|LINK

Ah then I am confirming that your jQuery reference might be missing. Why dont you try referring google jquery hosted libarary?

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

this.Fayaz();

Reply

RameshRajend...

Star

7983 Points

2099 Posts

Re: Image not showing

Nov 30, 2012 05:46 AM|LINK

 var imgs = [ '../img.png'];

Reply

EssCee

Member

548 Points

761 Posts

Re: Image not showing

Nov 30, 2012 12:23 PM|LINK

fayaz_3e

Ah then I am confirming that your jQuery reference might be missing. Why dont you try referring google jquery hosted libarary?

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

I did the following and still doesnt work

    <asp:ContentPlaceHolder ID="head" runat="server">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript">
            $(document).ready(function () {
                // Handler for .ready() called. 
                var imgs = ['http://i.s-microsoft.com/global/ImageStore/PublishingImages/logos/hp/logo-lg-1x.png',
                'http://i.s-microsoft.com/global/ImageStore/PublishingImages/logos/hp/test.jpg'];
                var cnt = imgs.length;
                setInterval(Slider, 3000);
 
                function Slider() {
                    $('img[id*=imageSlide]').fadeOut("slow", function () {
                        $(this).attr('src', imgs[(imgs.length++) % cnt]).fadeIn("slow");
                    });
                }
            });
        </script>
    </asp:ContentPlaceHolder>

Reply

fayaz_3e

Star

9332 Points

1744 Posts

Re: Image not showing

Nov 30, 2012 01:09 PM|LINK

You can not do both things under one script tag like adding src and writing script. Instead add two script tags one is for src and the other is for script...

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
 <script type="text/javascript">
            $(document).ready(function () {
                // Handler for .ready() called.
                var imgs = ['http://i.s-microsoft.com/global/ImageStore/PublishingImages/logos/hp/logo-lg-1x.png',
                'http://i.s-microsoft.com/global/ImageStore/PublishingImages/logos/hp/test.jpg'];
                var cnt = imgs.length;
                setInterval(Slider, 3000);
 
                function Slider() {
                    $('img[id*=imageSlide]').fadeOut("slow", function () {
                        $(this).attr('src', imgs[(imgs.length++) % cnt]).fadeIn("slow");
                    });
                }
            });
        </script>

this.Fayaz();

Reply

deepeshsp

Participant

850 Points

144 Posts

Re: Image not showing

Nov 30, 2012 01:49 PM|LINK

Hey, The problem is with your master page ContentPlaceHolder

You wrote the code inside the ContentPlaceHolder in master page like this.

<asp:ContentPlaceHolder ID="head" runat="server">
        <script type="text/javascript">
            $(document).ready(function () {
              //code here
        </script>
    </asp:ContentPlaceHolder>

And you may be calling the same content place holder in your page.

<%@ Page Title="" Language="C#" MasterPageFile="..." Inherits="WebApplication1.WebForm1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="cph" runat="server">
</asp:Content>

So your ID="head" ContentPlaceHolder will have empty HTML as given in the page.

Try this out.

<head runat="server">
    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server">        
    </asp:ContentPlaceHolder>
    <script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                // Handler for .ready() called.                 
            });
        </script>
</head>

Hope it helps,

Thank You...

Marked as answer by EssCee on Nov 30, 2012 06:41 PM

Reply

EssCee

Member

548 Points

761 Posts

Re: Image not showing

Nov 30, 2012 06:42 PM|LINK

That was it!!!!!!!!!!!!! Thank you very much for your help

Image not showing RSS

18 replies

EssCee

Re: Image not showing

fayaz_3e

Re: Image not showing

EssCee

Re: Image not showing

fayaz_3e

Re: Image not showing

RameshRajend...

Re: Image not showing

EssCee

Re: Image not showing

fayaz_3e

fayaz_3e

Re: Image not showing

deepeshsp

Re: Image not showing

EssCee

Re: Image not showing

This site is managed for Microsoft by Neudesic, LLC. | © 2013 Microsoft. All rights reserved.

Follow Us On:

Microsoft