Contact   •   Articles   •   Products   •   Search

Rick Strahl's Web Log

Wind, waves, code and everything in between...
ASP.NET • C# • HTML5 • JavaScript • AngularJs

WebLog Posts in Category HTML5


The Rise of JavaScript Frameworks - Part 1: Today



JavaScript frameworks have moved front and center in the mainstream in the last year and a half or so. When building modern Web applications, the bar has been raised significantly by what is possible in large part due to the more accessible mainstream frameworks that are available today to build rich client and mobile Web applications. In this post I'll explore why JavaScript frameworks have become so popular so quickly and how it effects the future of Web development. This two part series addresses the current state in this post, and the new crop of V2 frameworks arriving later this year in the Part 2.

Turn off HTML Input Auto Fixups for Mobile Devices



You ever run into a Web site that messes with your user input when you don't want it to while using your phone? You know, capitalize the first letter when you're trying to enter a username, or email address, or auto-correct text while typing a part number. As a mobile Web developer it's easy to forget about these automatic behaviors, when you don't want them as auto correction and fixup is the default behavior. To provide the best user experience sometimes we need to be agressive about turning enhancement functionality off. In this post I talk about auto-fixup behaviors for mobile browsers and how to turn them off in your applications. Your users will thank you for paying attention to this small detail.

IPad Scroll Issues with Fixed Content



Ran into some issues with fixed headers again in one of my mobile applications where on an iPad it appeared the content wouldn't scroll properly. I've run into this issue a few times and it turns out it's related to positional layout and specifically problematic on iPad Safari browsers. In this post I'll discuss the problem and the relatively simple workarounds.

Using FontAwesome Fonts for HTML Radio Buttons and Checkboxes



Spruce up your boring checkboxes and radio buttons with custom FontAwesome symbols using a little bit of CSS. If you're tired of boring checkboxes and radio buttons, or you simply want a more consistent look of these controls across browsers and controls check out FontAwesome to provide you with customizable checks and boxes to use for selection boxes. In this post I'll show how to use pure CSS to set up FontAwesome checkboxes and radios and talk about a few gotchas I ran into along the way.

A jquery-watch Plug-in for watching CSS styles and Attributes



A few years back I wrote about a jquery-watch plugin I wrote that can monitor CSS property and Attribute changes and let you get notified if one of the monitored properties are changed. Unfortunately the plugin broke a while back as browser and jQuery dropped some older APIs. In this post I describe an update to the jquery-watch plugin using the newer and more widely supported MutationObserver API that brings high performance DOM node monitoring.

The broken Promise of the Mobile Web



The Mobile Web has come a long way to provide the abillity to create rich UI and interactive, immersive and smooth Web based mobile applications. But there are still big gaps between mobile device features and what's available to Web developers when interacting with mobile devices. In this post I cover and contrast what's wrong with mobile Web development today and where I hope we are going, going forward.

Filtering List Data with a jQuery-searchFilter Plugin



When dealing with HTML based list data, filtering that data based on search text is a nice UI feature that's very useful for quickly finding what you're looking for. In this post I show you how to can create this nice UI effect with a few lines of jQuery code, and then provide a jQuery plug-in that simplifies the process further.

Using CSS Transitions to SlideUp and SlideDown



CSS Transitions are a nice way to replace jQuery animations with smoother counterparts. Some transitions however, like height and width transitions can be tricky to handle with pure CSS code due to container sizing issues. In this post I show how create create transitions to mimic most of jQuery's slideUp() and slideDown() functions using CSS and small jQuery plug-in.

Modern/Metro Internet Explorer: What were they thinking???



The 'Modern' version of Internet Explorer in Windows 8/8.1 is a full screen version Internet Explorer with a custom shell around it. This version of IE has a couple of pretty annoying quirks that affect Web pages significantly.

Prefilling an SMS on Mobile Devices with the sms: Uri Scheme



Popping up the native SMS app from a mobile HTML Web page is a nice feature that allows you to pre-fill info into a text for sending by a user of your mobile site. The syntax is a bit tricky due to some device inconsistencies, but here's how to do it.

Using HTML 5 SessionState to save rendered Page Content



SessionStorage and LocalStorage provide easy client side storage for Web applications. In this post I describe a specific scenario for caching list display data and state for a server rendered HTML application using sessionState. See how you can make a server rendered HTML application more user friendly and faster caching content on the client and redisplaying it when the user returns to a page he navigated from.

HTML5 Input type=date Formatting Issues



The new HTML5 Input types make it easier to display special formatted input types like dates and email addresses. Browsers that support them display a nice UI for editing and can validate values. However, support currently is limited and date formatting especially is complex as it involves using an ISO date format that doesn't fall back nicely to non-supporting browsers.

Wishful Thinking: Why can't HTML fix Script Attacks at the Source?



I'm dealing with user HTML input in a Web application today and again I curse over the complexities involved in sanitizing this html. So today I started dreaming about a possible alternative...

Using the HTML5 <input type="file" multiple="multiple"> Tag in ASP.NET



HTML5 allows for multiple files to be uploaded from a single file input control. Here's how you can use it and capture files in ASP.NET.

Make your CHM Help Files show HTML5 and CSS3 content



Want to get your CHM files to display content in HTML5 and CSS rather than the stock IE7 quirks more rendering used by default? This blog post describes how you can take advantage of newer HTML and CSS specs in your CHM files.

Changing the default HTML Templates to HTML5 in Visual Studio



The default WebForms templates in Visual Studio still use the XHTML doctype headers by default. HTML5 doctype headers are easier to use and read and with HTML5 support now becoming mainstream and backward compatible with older browsers its time to switch those doctype headers. This post demonstrates how to change the default VS templates or create new templates altogether. With HTML becoming more prominent and the new headers being easier to read and smaller in size, it's

HTML 5 Input Types - How useful is this really going to be?



The HTML 5 input controls enhancements seem like a nice feature - until you look a little closer and realize that that validation and styling these control enhancement use are likely going to interfere with your existing application logic and styling. Here are are some thoughts on the subject.


West Wind  © Rick Strahl, West Wind Technologies, 2005 - 2015