Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 16
  1. #1
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Macintosh My Idea about background floating....?

    I want to make a floating facebook or whatever link that hovers in the top left corner of my background image now. And the image that hovers would be for probably facebook or twitter.

    Explaining more.
    This is the normal background now


    But this is what I want-


    THANKS IN ADVANCE

  • #2
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Macintosh Anyone?

    It would be like a floating image- help please!?

  • #3
    Regular Coder Donkey's Avatar
    Join Date
    Sep 2003
    Location
    Blackfield UK
    Posts
    312
    Thanks
    1
    Thanked 36 Times in 36 Posts
    I don't think you mean floating. Do you want the image to stay in the same place while everything else scrolls past it? If so just give the image position fixed.
    " 90% of everything is crud" - Theodore Sturgeon
    Filthy Beast - a 60's Rock Band

  • #4
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts
    No its not like that. It would be put into the backround. I dont need it to stay in same spot. I need the clickable image added to the backround side using probably css

  • #5
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    I'm afraid you can't make clickable background images on account of them not having any hyperlinking properties.

    I suppose what you could do, is position a transparent image in the spot where the image occurs in the background and make that into a hyperlink.

    Having said that, I can't imagine why we are discussing clickable backgrounds in the first place. You would normally just place the image in the online flow or inside a block element, such as a div (on top of the background).

    Dr. V
    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • #6
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks Dr.V in what way could i post the Div?

  • #7
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Well, in your markup, you'd put something like:
    <div id="facebook_button"><a href="www.where-ever-it-goes/etc...l"><img src="facebook_link.gif" /></a></div>

    Then in your style sheet you could say:
    #facebook_button {margin-top: 5px; margin-left:20px}

    -------------------

    Or you could do it simpler than that by specifying a position for your image, without bothering to wrap it in a div:

    <a href="whatever/blah/etc"><img id="facebook_buttonthing" src="facebook_link.gif" /></a>

    #facebook_buttonthing {margin-top: 5px; margin-left: 20px}

    Or to write the margins as shorthand: {margin: 5px 0 0 20px}

    Dr. V
    Last edited by Doctor_Varney; 08-29-2010 at 11:29 PM.
    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • Users who have thanked Doctor_Varney for this post:

    neoweatherguy (08-31-2010)

  • #8
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Hey Dr.v

    What am I doing wrong with this?

    NEOWEATHER.COM/UNTITLED.HTML

    I do not want it to have a seperate space at the top but be directly next to the logo at the top (to the left<)

  • #9
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Use float:left

    I can't understand what you want.

    Dr. V

  • #10
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Picture explains a thousand words

  • #11
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Alright, neoweather, I'm understanding you now! What you said about putting the image in your background makes sense now, too. We couldn't understand, because where you're trying to put it, isn't what we'd call 'background', as far as CSS is concerned.

    Right, for a start, to me, there's a structural problem to this. AFAIK, if you want something on the outside of that main container, you can't just shove it in at the start or any margins applied to it will start affecting everything else in the page. Don't quote me on this but my instincts tell me this will need another column, so it can be styled seperately to the rest of the page.

    So from scratch, you need three columns, all floated left inside a container, which is margined 0 auto and while the important stuff in the middle silver box lives in the center column, you then have the left column free, to place that big F image anywhere you like, using a couple of margins.

    I suppose an easier alternative would be to try it with a position:absolute; but I take no responsibility for what might happen after that...

    Dr. V
    Last edited by Doctor_Varney; 08-31-2010 at 12:56 AM.

  • Users who have thanked Doctor_Varney for this post:

    neoweatherguy (08-31-2010)

  • #12
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Look, something worked!

  • #13
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Something's happened, though I'm not sure it's worked. The big blue F seems to have disappeared...

    Dr. V

  • #14
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts
    I switched my ideas around but still it worked. I just dont want the big f there

  • #15
    New Coder
    Join Date
    Jun 2010
    Posts
    52
    Thanks
    3
    Thanked 0 Times in 0 Posts
    So, I have done some work to my little side column- thanks to Dr. V

    But i am wondering if i can make it in to some type of javascript that you can X out of. Near the top right corner of the image that says extra features.

    More help needed Dr!


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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