www.webdeveloper.com
Results 1 to 11 of 11

Thread: [RESOLVED] Remove quare when image is not loaded yet...

  1. #1
    Join Date
    Aug 2012
    Posts
    43

    resolved [RESOLVED] Remove quare when image is not loaded yet...

    Hi,

    A small question,

    Is it possible to remove the square that you see when an image isnt loaded completly yet?
    I woul like to have it plain white (as is the background of the site)

    Thanks!

    S
    When the only tool you have is a hammer, everything looks like a nail.

  2. #2
    Join Date
    Nov 2006
    Location
    Oakland
    Posts
    500
    Specify the width and height of the image so the web browser can just reserve the required space for the image without showing the small square.

  3. #3
    Join Date
    Mar 2009
    Posts
    452


    i had done this using a trick maybe helps you too.

    <img src="blank.gif" width="100" height="100" style="background: url(image.jpg);" />

    put a blank gif or png as an image and the original image as its background
    but make sure blank image must exists
    width and height is also set properly

    and keep in mind its just a trick :P

  4. #4
    Join Date
    Aug 2012
    Posts
    43
    ah, i'll try it out! thanks
    When the only tool you have is a hammer, everything looks like a nail.

  5. #5
    Join Date
    Nov 2006
    Location
    Oakland
    Posts
    500
    Adding a background image to a foreground image is really an overkill if not counterproductive. Yes, it's a trick but one with a price: an additional http request to the server which just increases the page download time. Besides, using inline style should only be a last resort, read when really necessary.

  6. #6
    Join Date
    Aug 2012
    Location
    1453 Gingerwood ave, Milpitas CA 95035,
    Posts
    37
    But why you want to do so???????
    I mean it is just a matter of some seconds to reload the image on the page...
    Any specific reason behind doing it????

  7. #7
    Join Date
    Aug 2012
    Posts
    43
    sometimes, th eimages are not shown fast enough.
    at that moment, briefly, a square where the image should be shown is displayed (square as big as the image, not the little red cross thing)
    this square has borders etc...
    i wander how i can remove these squares, if even possible...

    thanks!
    When the only tool you have is a hammer, everything looks like a nail.

  8. #8
    Join Date
    Mar 2009
    Posts
    452
    hMMm, i think this issue is with a specific browser. chrome does not show this kind of the box while loading an image. you can optimize image file size and set some cache. also you can set image' style "display: none;" and then you can use onload event to show the image.

  9. #9
    Join Date
    Aug 2012
    Posts
    43
    Thank you ZABI :-)
    Thats why a started this treath:

    http://www.webdeveloper.com/forum/sh...s-is-loaded...

    Resolved as far as dealing with the problem :-)
    When the only tool you have is a hammer, everything looks like a nail.

  10. #10
    Join Date
    Mar 2009
    Posts
    452
    its gr8 if it works

    where r u from by the way ? u can PM if necessary

  11. #11
    Join Date
    Aug 2012
    Location
    1453 Gingerwood ave, Milpitas CA 95035,
    Posts
    37
    Quote Originally Posted by Nomistake View Post
    sometimes, th eimages are not shown fast enough.
    at that moment, briefly, a square where the image should be shown is displayed (square as big as the image, not the little red cross thing)
    this square has borders etc...
    i wander how i can remove these squares, if even possible...

    thanks!

    Ohkzz.... Now, got your point...

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles