Web Design

Web design guidelines, web development tools and plug-in tools and web browser tools and plug-in tools

Visual Studio 2010 HTML5

Goal: Enabling HTML5 validation and IntelliSense for Visual Studio 2010. By default it is set to XHTML 1.1. HTML5 support only came included with SP1 of Visual Studio 2010. However since HTML5 is not an official standard as yet and some of the 30 new elements are not suported in all browsers, so only a subset of the entire HTML5 specification is supported; support for both intellisense and validation for HTML5 with SP1. How to: After installing SP1 you have to tell Visual Studio to start using the...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

CSS3 - :not selector

CSS3 - :not selector Goal: Understand the different applications of the CSS3 :not selector Overview: Trying to find useful information about CSS3, and specifically the :not selector can be hard. So in order to try and alleviate that, here are some (hopefully) useful hints and tips. The Specification: The negation pseudo-class, :not(X), is a functional notation taking a simple selector […] as an argument. It represents an element that is not represented by the argument. Not so clear, is it?! What...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

Combine and compress javascript and css files in ASP.Net MVC

Goal: When loading js or css files, combine all the js files into one and all css files into one file respectively when rendering to improve on performance. Also compress if need be on the fly. In this example we use many css files and even more js files to organize the ASP.Net Mvc web app into manageable pieces. The reason for the separation is mainly because it gives the team the ability to work on different part of the web app by working on the affected css or js files. It also helps to decide...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

Loading CSS stylesheet for ascx ASP.Net user control

Goal: For performance reasons you want to load a piece of CSS only for the ascx file to which it applies. You do not want to embed the style as you cannot do this in ASP.Net ascx user controls. ASP.Net will render the style tag as HTML text. Solution: Some folks use the Page.Header.Controls. Add to add the stylesheet link in the ascx page or in the code behind. Not needed, you may specify a "link" tag in the ascx file, no need to specify "head" tag or anything else, just the link tag itself: <link...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

How to store arbitrary data in the DOM using jQuery

Goal: Storing arbitrary data inside the DOM Issue: Storing data : $('selector').attr('alt', 'my data'); Retrieving data: $('selector').attr('alt'); The ALT attribute is designed to be an alternative text description. For images the ALT text displays before the image is loaded. ALT is a required element for images and can only be used for image tags because its specific purpose is to describe images.So therefore, "alt" is an HTML attribute meant to give the tag meaning and not to store data. Also...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

How to dynamically add Edit button to grid for editing row using the jqGrid formedit

Goal: Dynamically add an Edit button to an empty column that will NOT trigger an inline edit but rather a jqGrid formedit for the selected row using the modal dialog option. Problem: All examples in the Demo version include editing inline and adding buttons to a column that only does an inline edit and the Demo version's getRowdata does not perform as expected. I tried it an could not get it working and the getRowData did not work as specified. Solution: gridComplete: function() { var rows = $(item).jqGrid('getRowData');...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

Restructuring a large ASP.Net Mvc app

So the issue is, you have a very large ASP.Net MVC app with many controllers and actions and don't know (or do) on how to restructure it for better maintenance. This article contains some thoughts around what my experiences were with building a large scale app with 10K+ lines of jQuery and 266 Actions dispersed over 98 Controllers. In the beginning: Yes God created .... no I created a relatively small scale Mvc app based on a very limited set of requirements, more like a XP or Agile experience or...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

How to stop and prompt user when closing browser

Scenario: For some reason you want to stop the user from closing the browser window or from redirecting away from the current page, based on some condition. The solution: window.onbeforeunload = function(event) { return true; } This will prompt you for input (like the JavaScript confirm pop-up menu). There is no way to override the text though. Some concerns: This works great but it may not be what you want all the time, as no matter if you click a hyperlink, hit submit, etc will prompt the user,...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

Useful jQuery Plug-ins

Normal 0 false false false MicrosoftInternetExplorer4 st1\:*{behavior:url(#ieooui) } /* Style Definitions */ table.MsoNormalTable {mso-style-name:"Table Normal"; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-parent:""; mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-para-margin:0in; mso-para-margin-bottom:.000... mso-pagination:widow-orphan; font-size:10.0pt; font-family:"Times New Roman"; mso-ansi-language:#0400; mso-fareast-language:#0400; mso-bidi-language:#0400;}...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

Favorite Techical Books

A list of my favorite technical books that I found very useful over the years. Most of them are related to CSS, jQuery, DHTML, Ajax, and ASP.NET C#: &amp;amp;amp;lt;A HREF=&amp;amp;quot;http... _fcksavedurl=&amp;amp;q...
  • Share This Post:
  • Share on Twitter
  • Share on Facebook
  • Share on Technorati

Full Web Design Archive

Twitter