[resolved] John Chow and Problogger Logos... How to do it??? (8 posts)

  1. elie-palima
    Posted 4 years ago #

    Whenever I go to problogger's and johnchow's blog and hit right click on their logos, the option to 'view' or 'save' the image is not there!

    I was wondering if anyone here could tell me how do you do that??? cause I would like to implement it on my site as well. I asked both bloggers the question but they say they don't know how to do it because they didn't code it.

    anyway, please help me...


  2. esmi
    Forum Moderator
    Posted 4 years ago #

    Please, please, don't try to disable right-click. Not only is it ineffective against image theft, it also creates major problems for some users who rely on access to their browsers right-click context menu.

  3. elie-palima
    Posted 4 years ago #

    hello esmi, I don't want to disable right click. I just want to know how johnchow.com and problogger.net does that to their images. when you right click on their sites, the right click is working.

    however, when you go and right click one of their images, (specifically their logo) right click is working however, the option to 'view' or 'save' the images is not there!

    it's almost like they made their images into a 'thumbnail'

    my question is.. how to do that? thanks.

  4. esmi
    Forum Moderator
    Posted 4 years ago #

    Could be a specific piece of javascript or it could be that some of these images are being applied via CSS. Hard to tell without seeing the pages in question.

  5. elie-palima
    Posted 4 years ago #

    definitely not css! the page is exactly on http://www.johnchow.com and http://problogger.net

    right click on their logo and the mentioned menus are not there.

    yeah, maybe you're right.. a piece of javascript.. but that's too advanced stuff for me.. lol. =)


  6. esmi
    Forum Moderator
    Posted 4 years ago #

    The logo on http://johnchow.com/ is simply being applied via CSS as a background image for a block on the header:

    h.custom #header #logo a {
        background: url("images/logo.png") no-repeat;
        border: 0 none;
        color: #000000;
        display: block;
        height: 60px;
        margin: 0;
        outline: medium none;
        padding: 0;
        text-indent: -9999px;
        width: 454px;

    The logo on http://problogger.net/ is part of the CSS background image being applied to the layout wrapper:

    #wrap {
        background: url("images/bg.png") no-repeat scroll center top;
        margin: 0 auto;
        position: relative;

    Sorry - no mysteries there. ;-)

  7. elie-palima
    Posted 4 years ago #

    WOW!! I didn't know we could do that! now I know! I'm so excited to do it on my site. thank you very much 'master' esmi!

  8. esmi
    Forum Moderator
    Posted 4 years ago #

    No problem :-)

Topic Closed

This topic has been closed to new replies.

About this Topic