4quiriang. Blog Archive » Quick Embed Code to Add Comments To Any Site. It may not be a multi-million dollar venture-backed startup, but Lev Walkin has an elegant solution to a common feature of the social web, commenting.
JS-Kit is an entirely free little javascript embed that allows you to add threaded comments to any web page in one line: "<script src=" JS-Kit works by running Lev’s javascript code, which along with the website’s referral, fetches the appropriate comment data from his server. The comments are fully customizable by CSS and multiple comment instances can be displayed on the same referring URL by changing the “path” attribute of the comment.
That way you could have a photo page with unique comment threads for each picture. Lev Walkin is a Cisco Security Engineer out of Santa Clara, and originally came up with the idea as a way to help he wife, a web designer, easily add comments to her sites. Feel free to test the script after the jump… Note: JS-Kit will forward comments from your thread to your email if you provide it. Thumbnails. Pre 2006 copyright © stu nicholls - CSS play Information This is a demonstration of an idea for a picture gallery where you use thumbnail images to link to the actual picture.
This one will show you which ones you have viewed by sepia toning the thumbnail after you have viewed the full size image. Just click on any of the images above to be taken to another page displaying an enlarged image. NOTE : This no longer works in the latest browsers because they have dropped support for the :visited pseudo-class as they consider this 'unsafe'. Copyright You may use this method on your personal 'non-profit' web site without seeking my permission. Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay. If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced.
Blog Archive » Using Fewer Images. (This post was originally published in 2006. I’ve just moved it from my old Wordpress blog to Tumblr.) Image rollovers are usually composed of two individual images; one for the default state and one for when the mouse is hovered over the image or link. However, it bears some advantages to use a single image by taking advantage of CSS background image offsets. I’ll start by describing how a rollover for an anchor is typically done. The HTML code could look like something like this: <a href="#" id="yaprak"> </a> The associated CSS would then have items like: Two individual images for the two states would have to be uploaded to the server and they would look like this: Finally, the end result would be: The default image that is visible to the user is the black & white yaprak_bw.png and when you hover over the image, it’s replaced by yaprak_color.png with its full-color glory.
The HTML code is the same. There’s only a single image: The end result is: News List. This is a styled unordered list, based partly on the method used in the CSS Teaser Box demo.
The list was designed to display links to recent news, but there are plenty of other uses for something like this. Each list item will expand vertically to contain any amount of text. It will take either an extremely large font size or a heading that is several lines long to break the effect. Increasing the height of the background image will let the heading grow taller before problems occur. No extra markup is needed. Hover state? View source to see the XHTML and CSS. {*style:<ul>*} {*style:<li>*} {*style:<h3>*}{*style:<a href=' Item 1{*style:</a>*}{*style:</h3>*} {*style:<br>*}Nulla dictum.