SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Sep 2006
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Making a button like ShareThis

    Hi,

    Iím a bit of newb to JavaScript and Iím interested in the way the ShareThis button (sharethis.com) works for a project iím working on. I was wondering how the following is achievedÖ

    - Script link outputting a graphic and text on the webpage
    Ė Open/close on click
    Ė Clicking opens box displaying content

    Iím not interested in any of the other features.

    Could any kind person point me in the right direction?

    Thank you.

  2. #2
    Follow Me On Twitter: @djg gold trophysilver trophybronze trophy Dan Grossman's Avatar
    Join Date
    Aug 2000
    Location
    Philadephia, PA
    Posts
    20,578
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    These are essentially all achieved by modifying the CSS of some page elements with JavaScript.

    Your script can start by outputting those elements:
    Code:
    document.write('<div id="box">Graphic and Text Here</div>');
    And onclick event handlers that show/hide elements like this:
    Code:
    //show
    document.getElementById('box').style.display = 'block';
    
    //hide
    document.getElementById('box').style.display = 'none';

  3. #3
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Looking at it, sharethis only provide an toolbar/addon for the browser. It's not site specific.

    It doesn't seem to have anything to do with javascript unless it injects the content directly from the browser...


  4. #4
    SitePoint Member
    Join Date
    Sep 2006
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Dan thanks for the reply. I'll start testing that.

    gRoberts there is an addon version and webpage button version. See an example of the latter here...

    sharethis.com/publisher

    JavaScript they use (incomprehensible to me)

    w.sharethis.com/widget/

  5. #5
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I see what you mean... Dan's suggestion is the basis of how it appears and disappears.

    Each social networking website provides a means to add an url. The extra functionality is can done easily enough.

    Where do you start? It all depends on your knowledge. If your fairly new to javascript, you'll probably be best off using something like Mootools or a similar javascript framework to work with.

    I'd also look at other things like http://www.addthis.com/ which has a very simple but effective version.



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
  •