Category: Coding
This extended category features articles on client-side and server-side programming languages, tools, frameworks and libraries, as well as back-end issues. Experts and professionals reveal their coding tips, tricks and ideas. .
Popular tags in this category: CSS, CSS3, HTML, JavaScript, jQuery, PHP, Techniques, Essentials, Tools.
A lightbox is one of those tools that work great on the desktop but often fail on small mobile devices. These days, finding a plugin that is responsive and that displays content right away is hard. For this reason, I created Magnific Popup, an open-source lightbox plugin focused on performance.

In this article, I’ll share the techniques I employed in creating this plugin, techniques that can make your lightbox much faster and easier to use, whatever the device being used.
Read more...
This article is packed with a number of quirks and issues you should be aware of when working with CSS3 transitions. Please note that I’m not showing any workarounds or giving advice on how to circumvent the issues discussed.

Alex MacCaw has already written a very insightful and thorough article on “All You Need to Know About CSS Transitions.” Whereas Alex wrote about achieving particular effects, I’m going to talk about the technical background, especially the JavaScript-facing side. Pitfalls — this article is all about pitfalls.
Read more...
Static typing is great because it keeps you out of trouble. Dynamic typing is great because it gets out of your way and lets you get your work done faster. The debate between strongly and dynamically typed languages rages on, but understanding the issue starts with weak typing and languages such as C.

C treats everything like a number. A character like a or 7 or % is the number of the ASCII symbol representing it; “true” and “false” are just 1 and 0. C defines variables with types such as int for integer and char for character, but that just defines how much memory to use. To access the variable and print it out, I need to know the type.
Read more...
Generated content was first introduced in the CSS2 specification. For several years, the feature was used by relatively few Web authors due to inconsistent browser support.

With the release of Internet Explorer 8 in 2009, generated content was rediscovered, and many interesting implementations were adopted for the first time. In this article, we’ll discuss some possible uses of generated content.
Read more...
There are several ways to make navigation responsive, and usually the solution we need is quite straightforward. But despite the apparent simplicity, there are many underlying factors which, when thought through and implemented properly, can make a simple solution even better without adding more complexity to the user interface.

One of the problems I’ve encountered while building responsive navigations is that browsers currently don’t support CSS3 transitions to a height which is defined auto. Most of the time, we shouldn’t use fixed height either because the height of menu items might not be the same in all browsers, and the number of items may change. I also always try to reduce the weight of pages I build, so I’ve been wanting a solution that doesn’t require a big library such as jQuery to work.
Read more...
In the first part of this series, we discussed Backbone.Marionette’s Application. This time around, we’ll discuss the module system that is included in Backbone.Marionette. Modules are accessible through the Application, but modules are a very large topic and deserve an article dedicated to them.

Before we get into the details of how to use Marionette’s module system, we should make sure we all have a decent definition of a module. A module is an independent unit of code that ideally does one thing. It can be used in conjunction with other modules to create an entire system. The more independent a unit of code is, the more easily it can be exchanged or internally modified without affecting other parts of the system.
Read more...
Back in 2009, Sergey Chikuyonok wrote an article to present a new way of writing HTML and CSS code. This revolutionary plugin, called Zen Coding, has helped many developers through the years and has now reached a new level.

Emmet, previously known as Zen Coding, is the most productive and time-saving text-editor plugin you will ever see. By instantly expanding simple abbreviations into complex code snippets, Emmet can turn you into a more productive developer.
Read more...
Twitter’s Bootstrap has taken off like a rocket since its release a year ago. The popular CSS framework supplies a responsive grid system, pre-styled components and JavaScript plugins to a parade of websites.

One of Bootstrap’s appeals is that it just works. It’s a significant time-saver when starting a website, so much so that major organizations such as NBC, NASA and the White House are adopting it. And it empowers even the non-designers among us to turn out something decent.
Read more...
Responsive Web design has been evolving rapidly ever since Ethan Marcotte coined the term two years ago. Since then, techniques have emerged, become best practices and formed part of our ever-changing methodology.

A few obvious examples are the multitude of responsive image techniques, conditional loading, and responsive design and server-side components (RESS), among many other existing and emerging strands stemming from the core concept of responsive Web design.
Read more...