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.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Oct 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Css popup pickle??

    Ok....here is my goal. On my website im trying to use a z-index layer as a popup for my photo viewer. This photo viewer will have links, an iframe, possibly a table. Now here is what i got and it kind of works.
    My CSS
    Code:
    .ratmilk {
    	display: block;
    	left: -999em;
    	position: absolute;
    	width: 90%;
    	height: 95%;
    	top: 0;
    	background: #c0c0c0;
    	z-index: 2;
    }
    
    .ratmilk:focus, a.ratmilk:hover {
    	left: 5%;
    }
    Here is my Html
    Code:
    <a href="#dumbmonkeyface">Photo album</a>
    <a class="ratmilk" name="dumbmonkeyface">content goes here</a>
    Now like i said ive got this to work but when i try to change the anchor to a paragraph type dag or even a div....it wont work. It does not work very well to put my content in this anchor. I also have no idea what to do for the link to close this picture viewer popup layer. I'm new to css and ive been reading and learning from sons of suckerfish dropdown menus and such.
    Any help is appreciated.

    Jeremy

  • #2
    Senior Coder gsnedders's Avatar
    Join Date
    Jan 2004
    Posts
    2,340
    Thanks
    1
    Thanked 7 Times in 7 Posts
    For an anchor to work, the target must be on a <a> tag, eg.
    Code:
    <a name="foo"></a>

  • #3
    New to the CF scene
    Join Date
    Oct 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    the id attribute also works.
    Code:
    <a href="#foo">link here</a><p id="foo">content</p>

  • #4
    New to the CF scene
    Join Date
    Oct 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Never Mind

    never mind i figured it out with the :target pseudo and some javascript.


  •  

    Posting Permissions

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