Change FlexSlider Slides The Easy Way

Responsive Web Design SlideshowFinding a slideshow plugin for jQuery might seem like it’s going to be an easy task, but it takes time to review them, and there are a few things to consider. Since I’ve been working with responsive web design lately, a slideshow plugin’s ability to scale with the rest of the design is very important. There are other factors to consider though, and in the end I chose FlexSlider by WooThemes.

Continue reading

Responsive Breakpoints for jQuery

Lately I’ve been working with a lot of responsive web designs, and this type of work is obviously related to CSS, but like any front-end work, javascript (in this case jQuery) is always in the mix. I wouldn’t call it challenging, but I had to come up with a solution to inform jQuery of what screen width breakpoint the responsive design was displaying.

Since we have the ability to change the styling of an element at each breakpoint in our designs, we can simply apply a different value for a specific CSS rule at each breakpoint. In the case of the latest design I’ve been working on, I chose to change the text color of some text that that was being hidden by an image replacement.

Continue reading

jQuery Password Toggle Plugin

Password ToggleHave you ever had to sign in to a website, and wanted to be able to see the password as you type it? Maybe you don’t have Mr. Evil looking over your shoulder, and seeing your password would help you know if you had typed it in correctly. I had seen such functionality on a website in the past, and this week I decided to create a jQuery plugin for use on my customer’s websites. I actually searched the internet for such a plugin, and came across a few, but for various reasons decided they were not right for me. With help from some of the forum members at SitePoint, I came up with a solution that worked in all modern browsers, and met my needs. Feel free to download the plugin and use it. The plugin works in the latest versions of Firefox, Chrome, Opera, Safari, and Internet Explorer, as well as Internet Explorer 7 and Internet Explorer 8 (Sorry, I didn’t check IE6).

Continue reading