Page 1 of 2 12 LastLast
Results 1 to 10 of 14

Thread: How to Prevent Image from loading top/left? - Html?

  1. #1
    100%'s Avatar ╚════╩═╬════╝
    Join Date
    Jan 2003
    Posts
    13,383
    How to Prevent Image from loading top/left? - Html?

    I have used Dreamweaver and Namowebeditor but cant seem to find a solution.
    i want 3 frames with scroll bars - all 3 hold the same image but i want them to load in different positions. When i save the file - i Always get the images loaded top left

    Is there anyway to state where the Image will be placed?

    or do i have to do the annoying method of adding "white space" around the image to make it load where it should(this method is very complicated)

    For Example
    (each frame consists of the same whole image)
    here is the example whole image


    How It Is when it loads (everything top left...)




    How i would like it - when it loads (control where the position shall be)


  2. Internet, Programming and Graphics   -   #2
    orcutt989's Avatar Blargh
    Join Date
    Dec 2003
    Location
    States
    Posts
    2,186
    When you are using frames, it is hard to place images. I always use layers. If you use layers you can place the image anywhere you want, and whether you want scrollbars or not. Use dreamweaver, use the Layer tool, drag the 3 layers to where you want them. Then load the image into them. In the properties window make shure scroll is set to "auto", and then viola. Oh yes, and make sure you make the layer small, maybe like hafl the size of the image. Then load the image into it, so you will trick the layer into making a scrollbar. But still make it the correct length, only make the height of the layer small.

  3. Internet, Programming and Graphics   -   #3
    maskawaih's Avatar Custom User Title BT Rep: +3
    Join Date
    Aug 2004
    Location
    Malaysia
    Age
    39
    Posts
    713
    just like what orcutt says. make somthing using tables is fun too.

  4. Internet, Programming and Graphics   -   #4
    Is that gay porn??

    Need a cheap/easy way of modding your xbox? Check this out.


  5. Internet, Programming and Graphics   -   #5
    a) stop using frames
    b) if you want to position your images, try using css and making the image a background rather than using <img> tags.

    the code would look similar to the following (I'm pretending these are <div>'s you've ID'd.
    the css sets the width and height of the divs here:

    HTML Code:
    #one { 
    height:300px;
    with:150px;
    background-image:url(yourimage.jpg);
    background-repeat:no-repeat;
    background-position:top left;
    }
    
    or you can use shorthand like
    
    #one {
    height:300px;
    width:150px;
    background:url(yourimage.jpg) no-repeat top left;
    }
    you can use any boolean terms for the position..like...
    center left
    center center
    top right
    bottom center
    etc

    alternately, you can specify X and Y coordinates, either specifially, or by percentage.
    like:
    background-position: 24 90;
    or
    background-position:30% 10%;

    if all else fails, send me your code, and maybe a photoshop representation of what you're trying to do, and I'll fix it/show you.

    There is a crack in everything.
    That's how the light gets in.

  6. Internet, Programming and Graphics   -   #6
    uNz[i]'s Avatar Out of order
    Join Date
    Mar 2003
    Posts
    2,217
    Avoid using nested tables.
    Putting too many tables inside each other can slow your page's load time to a crawl.

  7. Internet, Programming and Graphics   -   #7
    maskawaih's Avatar Custom User Title BT Rep: +3
    Join Date
    Aug 2004
    Location
    Malaysia
    Age
    39
    Posts
    713
    Quote Originally Posted by uNz[i]
    Avoid using nested tables.
    Putting too many tables inside each other can slow your page's load time to a crawl.
    but not like 10 seconds load. 3-4 seconds.

  8. Internet, Programming and Graphics   -   #8
    Quote Originally Posted by uNz[i]
    Avoid using nested tables.
    Putting too many tables inside each other can slow your page's load time to a crawl.
    using tables for layout purposes is....old-fashioned, labor-intensive, and markup-heavy.

    Use css.

    There is a crack in everything.
    That's how the light gets in.

  9. Internet, Programming and Graphics   -   #9
    maskawaih's Avatar Custom User Title BT Rep: +3
    Join Date
    Aug 2004
    Location
    Malaysia
    Age
    39
    Posts
    713
    Quote Originally Posted by motherflux
    using tables for layout purposes is....old-fashioned, labor-intensive, and markup-heavy.

    Use css.
    ... and make it separate.

  10. Internet, Programming and Graphics   -   #10
    uNz[i]'s Avatar Out of order
    Join Date
    Mar 2003
    Posts
    2,217
    Quote Originally Posted by motherflux
    using tables for layout purposes is....old-fashioned, labor-intensive, and markup-heavy.

    Use css.
    Exactly. But it's a trap many folks new to html can fall into.*

    Consider the plight of the html newbie.

    They've just got thier head around html and it's 'quirks', when suddenly they discover they need to learn css too.
    So they get started. They find font styles fairly straightforward, but then encounter other functions, some of which aren't so easily learnt.

    Thier website is suddenly all sorts of weird colours, some of the text has vanished right off the edge of the page and how the hell did that bloody <div> get all the way over there??

    Some will just reach a point where they say 'sod it' and start doing layouts using tables because it just seems to be the easier option.
    Then they wonder why thier site takes ages to load compared to sites they've seen out there on the web.

    ...and then they find out about javascript.

    *Parts of this post are based on a true story.

Page 1 of 2 12 LastLast

Bookmarks

Posting Permissions

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