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 5 of 5
  1. #1
    Regular Coder saeed's Avatar
    Join Date
    Oct 2002
    Location
    West Yorkshire
    Posts
    343
    Thanks
    32
    Thanked 0 Times in 0 Posts

    Image hide behind the template.

    Please refer to the attach screenshot.

    you'll notice red box on the bottom left of the image on which if end-user clicks it goes to top of the page. Script is working alright but image is not appearing on the front.

    here is the CSS code which i am using for displaying the image.

    Please help. Thank you very much!

    Code:
    #toTop {
       display:none;
       text-decoration:none;
       position:fixed;
       bottom:10px;
       right:10px;
       overflow:hidden;
       width:51px;
       height:51px;
       border:none;
       text-indent:100%;
       background:url(../images/ui.totop.png) no-repeat left top;
    }
    
    #toTopHover {
       background:url(../images/ui.totop.png) no-repeat left -51px;
       width:51px;
       height:51px;
       display:block;
       overflow:hidden;
       float:left;
       opacity: 0;
       -moz-opacity: 0;
       filter:alpha(opacity=0);
    }
    
    #toTop:active, #toTop:focus {
       outline:none;
    }
    Attached Thumbnails Attached Thumbnails Image hide behind the template.-screenshot.jpg  
    Don't click on this!

    #!/usr/bin/saeed

  • #2
    New Coder
    Join Date
    Sep 2012
    Posts
    22
    Thanks
    0
    Thanked 6 Times in 6 Posts
    Instead of
    background:url(../images/ui.totop.png) no-repeat left -51px; you have to use below statement:
    background-image:url(../images/ui.totop.png) no-repeat left -51px;.

    Like that you have to update.
    Please let me know if it solved.

  • #3
    Regular Coder saeed's Avatar
    Join Date
    Oct 2002
    Location
    West Yorkshire
    Posts
    343
    Thanks
    32
    Thanked 0 Times in 0 Posts
    thank you for the quick reply.

    well the issue is still the same. no change in displaying the image.
    Don't click on this!

    #!/usr/bin/saeed

  • #4
    New Coder
    Join Date
    Sep 2012
    Posts
    22
    Thanks
    0
    Thanked 6 Times in 6 Posts
    Please use "." instead of "#" in css.
    Code:
    .toTop {
       display:none;
       text-decoration:none;
       position:fixed;
       bottom:10px;
       right:10px;
       overflow:hidden;
       width:51px;
       height:51px;
       border:none;
       text-indent:100%;
       background:url(../images/ui.totop.png) no-repeat left top;
    }
    
    .toTopHover {
       background:url(../images/ui.totop.png) no-repeat left -51px;
       width:51px;
       height:51px;
       display:block;
       overflow:hidden;
       float:left;
       opacity: 0;
       -moz-opacity: 0;
       filter:alpha(opacity=0);
    }
    
    .toTop:active, .toTop:focus {
       outline:none;
    }

  • #5
    Regular Coder saeed's Avatar
    Join Date
    Oct 2002
    Location
    West Yorkshire
    Posts
    343
    Thanks
    32
    Thanked 0 Times in 0 Posts
    Nope. infact this time i cant see the image.. instead of the image when i am at the bottom of the page. 'To Top' text appeared and script feature is working on it.
    Don't click on this!

    #!/usr/bin/saeed


  •  

    Posting Permissions

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