The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

loading effect on spoiler images

5 posters

The forum of the forums :: Miscellaneous :: Garbage

Go down

loading effect on spoiler images Empty loading effect on spoiler images

Post by isnanz August 14th 2010, 7:27 am

how to create a loading effect on the spoiler that contains images?

loading images that I use:
loading effect on spoiler images Ajax-loader
isnanz
isnanz
Forumember

Male Posts : 206
Reputation : 0
Language : Indonesian
Location : Indonesia

https://help.forumotion.com

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by ankillien August 14th 2010, 8:22 am

Hello,

Here is a script that can help you...
http://jqueryfordesigners.com/image-loading/

It will require template editing.
ankillien
ankillien
Energetic

Posts : 5198
Reputation : 129
Language : English, XHTML, CSS, JS, PHP, SQL

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by isnanz August 14th 2010, 8:39 am

ankillien wrote:Hello,

Here is a script that can help you...
http://jqueryfordesigners.com/image-loading/

It will require template editing.

I will try..
isnanz
isnanz
Forumember

Male Posts : 206
Reputation : 0
Language : Indonesian
Location : Indonesia

https://help.forumotion.com

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by mallowag3124 August 26th 2010, 8:44 am

can u make it simple....?
im a newbie
cant understand.... bwi
avatar
mallowag3124
Forumember

Posts : 79
Reputation : 0
Language : english

http://desucult.omgforum.net/

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by blindbat1457 August 26th 2010, 9:31 am

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Image Loading</title>
    <style type="text/css" media="screen">
    <!--
        BODY { margin: 10px; padding: 0; font: 1em "Trebuchet MS", verdana, arial, sans-serif; font-size: 100%; }
        H1 { margin-bottom: 2px; }

        DIV#loader {
            border: 1px solid #ccc;
            width: 500px;
            height: 500px;
            overflow: hidden;
        }

        DIV#loader.loading {
            background: url(/images/spinner.gif) no-repeat center center;
        }
    -->
    </style>

    <script src="/js/jquery.js" type="text/javascript"></script>

    <script type="text/javascript">
    <!--
    $(function () {
        var img = new Image();
        $(img).load(function () {
            //$(this).css('display', 'none'); // .hide() doesn't work in Safari when the element isn't on the DOM already
            $(this).hide();
            $('#loader').removeClass('loading').append(this);
            $(this).fadeIn();
        }).error(function () {
            // notify the user that the image could not be loaded
        }).attr('src', 'http://farm3.static.flickr.com/2405/2238919394_4c9b5aa921_o.jpg');
    });
   
    //-->
    </script>
</head>
<body id="page">
    <h1>Image Loading</h1>
    <p>This demonstration shows how to pre-load an image in the background while showing a loading screen.  It also supports loading the image, then running additional code, such as Ajax requests before finally showing the image.</p>
    <p><a href="http://jqueryfordesigners.com/image-loading/">Read the article this demonstration relates to</a></p>
    <div id="loader" class="loading">

    </div>
    <p><a href="http://www.flickr.com/photos/remysharp/">More photos...</a></p>

    <!-- this is just a way to simulate a delay (the script will sleep for 2 seconds then response) -->
    <script src="image-load-demo.php?action=delay" type="text/javascript" charset="utf-8"></script>
</body>
</html>

Here is the source code for it.. what part do I use?

Edit while I am at it.. how about images in general and not just spoiler images.
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by mallowag3124 August 27th 2010, 8:31 am

where should i place this?
avatar
mallowag3124
Forumember

Posts : 79
Reputation : 0
Language : english

http://desucult.omgforum.net/

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by blindbat1457 August 27th 2010, 8:31 am

Not sure wait for a reply.
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by mallowag3124 August 27th 2010, 8:33 am

ok...
ill w8 for it
avatar
mallowag3124
Forumember

Posts : 79
Reputation : 0
Language : english

http://desucult.omgforum.net/

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by blindbat1457 August 27th 2010, 10:35 am

I also noticed this code has the personal information and URL to the picture and such. Hmm scratch
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by mallowag3124 August 28th 2010, 4:04 am

uhmm...
i hope someone answer this?
avatar
mallowag3124
Forumember

Posts : 79
Reputation : 0
Language : english

http://desucult.omgforum.net/

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by blindbat1457 August 28th 2010, 5:07 am

Not sure.. it will come around eventually just takes a while.
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by blindbat1457 August 30th 2010, 7:23 am

bump
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by zachoftheglen2 August 30th 2010, 11:07 pm

Bump for you Smile
zachoftheglen2
zachoftheglen2
Forumember

Posts : 119
Reputation : 0
Language : English

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by mallowag3124 August 31st 2010, 7:28 am

men....
i hope something happens!
avatar
mallowag3124
Forumember

Posts : 79
Reputation : 0
Language : english

http://desucult.omgforum.net/

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by blindbat1457 August 31st 2010, 10:07 pm

bump
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

loading effect on spoiler images Empty Re: loading effect on spoiler images

Post by blindbat1457 September 3rd 2010, 6:52 pm

bump
blindbat1457
blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

Back to top

- Similar topics

The forum of the forums :: Miscellaneous :: Garbage

 
Permissions in this forum:
You cannot reply to topics in this forum