Archive for the ‘Code Samples’ Category

Add Slideshow to Your Website

Friday, April 16th, 2010

Slideshows are fun. You can use that to share event photos, or you can use that to rotate through a list of your portfolio items without people have to click around or scroll to read all.
There are many ways to get this done. We will look at two easy-to-use options in this article.
NextGen Gallery
If you [...]

CSS Drop Shadows

Wednesday, September 24th, 2008

Per request from a client, we need to create some text with CSS based drop shadows that works across all major browsers.
 After some research and comparison, we implemented the technique by Scott Jehl. http://www.scottjehl.com/v7/index.php/process/html_text_drop_shadows
The CSS is very simple … no filters and hacks. Yes this solution works beautifully across IE, FF on PC, as well as [...]

CSS for a Calendar-Like Date Stamp

Friday, May 23rd, 2008

The date stamp you see here on the page can be made with following code:
.post-date {
 background: url(images/date_icon_blue.jpg) no-repeat;
 float: left;
 height: 40px;
 line-height: 18px;
 margin: 0px 5px 0px 0px;
 text-align: center;
 width: 37px;
}
.post-day {
 color: #434B4D;
 font-size: 20px;
 margin: 0px 0px 1px 0px;
 padding: 0px;
 text-align: center;
 width: 37px;
}
.post-month {
 color: #FFFFFF;
 font-size: 10px;
 margin: 0px 0px 1px 0px;
 padding: 0px;
 text-align: center;
 width: 37px;
}
Background image used in the code:

Retrieve a Portion of Long Text

Monday, December 31st, 2007

Often, I need to get the first few sentances of a long article or post to display as summary. Things to consider include not cutting off any partial words; add … if there is more; make sure html tags are stripped off otherwise we might bury an openning tag in the summary and that will screw up the [...]