8 Clever Tricks with CSS Functions — SitePoint
CSS is capable of much more than many web developers realise. The stylesheet language continues to get more and more powerful with every passing year, bringing functionality to the browser that otherwise would be fulfilled by JavaScript. In this article, we’ll take a look at eight clever tricks with CSS functions that do not require JavaScript at all. 1. Pure CSS Tooltips A lot of websites still u
10 Photoshop Plugins to Speed up Your Web Designs — SitePoint
While Photoshop was never originally intended for web design, it does come with plenty of under-the-hood power right out of the box. It’s: Extremely reliable with few nasty surprises Plenty of styling options for web contexts Well-suited for HD web design thanks to easy editing of SVGs and raster images Comprehensive feature set that lets you design layout to images all in one place Of course, eve
10 jQuery Horizontal Scroll Demos & Plugins — SitePoint
In today’s post we bring to you 10 jQuery Horizontal Scroll Demos & Plugins useful for those who see things horizontally. I guess we have to accept some people scroll both ways! :) Updated: March 2016 Updated all plugins and demos with the latest versions and added some new ones. Also removed plugins which aren’t in development anymore. 1. ScrollMagic ScrollMagic helps you to easily react to the u
An Introduction to AngularJS Style Guides — SitePoint
This article was peer reviewed by Tom Greco, Divy Tolia and Rabi Kiran. Thanks to all of SitePoint’s peer reviewers for making SitePoint content the best it can be! What is a style guide? Do AngularJS projects need a style guide, and why? Which are the most popular AngularJS style guides? How would you use a style guide in a team of developers? This article is going to answer all these questions.
Introduction to jCanvas: jQuery Meets HTML5 Canvas — SitePoint
HTML5 lets you draw graphics straight into your web page using the <canvas> element and its related JavaScript API. In this post, I’m going to introduce you to jCanvas, a free and open source jQuery-based library for the HTML5 Canvas API. If you develop with jQuery, jCanvas makes it easier and quicker to code cool canvas drawings and interactive applications using jQuery syntax. What is jCanvas? T
Google Maps Made Easy with GMaps.js — SitePoint
Example Pen Markers A marker is a locator on a map. It’s generally shown as a balloon hanging over the marked location. GMaps offers the addMarker() method to add a marker. It accepts an object literal with the following properties for the marker: lat: Latitude lng: Longitude title: Title displayed on mouseover icon: Custom image for the marker details: Custom object with extra data infoWindow: In
9 JavaScript Libraries for Working with Local Storage — SitePoint
The HTML5 Local Storage API (part of Web Storage) has excellent browser support and is being used in more and more applications. It has a simple API and certainly has its drawbacks, similar to cookies. Over the past year or so I’ve come across quite a few tools and libraries that use the localStorage API so I’ve compiled many of them together into this post with some code examples and discussion o
Switching from Ruby Sass to LibSass — SitePoint
If you’ve been following the recent major announcements from the Sass community, you may have seen the huge LibSass 3.0 announcement at SassConf 2014. For some time now, the Sass Ruby gem has been getting more advanced features, while LibSass has been updated less quickly. This means that many people using LibSass to compile their Sass (usually through node-sass in a Grunt/Gulp workflow) have been
CSS Post-Processing With Pleeease — SitePoint
Pre-processors such as Sass, Less, and Stylus have revolutionized CSS development. If you’re a pre-processor skeptic like I was, try using Sass for a project or two: you won’t ever return to raw CSS again. Despite this attention, developers rarely consider post-processors. Pleeease could change that perception… What’s a CSS Post-Processor? A post-processor applies changes to a CSS file after it’s
How to Capture CSS3 Animation Events in JavaScript — SitePoint
CSS3 animations are smooth and quick to implement but, unlike JavaScript, you don’t have frame-by-frame control. Fortunately, you can apply event handlers to any element to determine the animation state. This permits fine-grained control such as playing different animations in sequence. Consider this simple CSS3 animation: #anim.enable { -webkit-animation: flash 1s ease 3; -moz-animation: flash 1s
My Favorite Sass Tools — SitePoint
Sass was introduced about 7 years ago as a workaround for CSS flaws and has come a long way since then. It has played a major role in popularizing CSS preprocessing, to the point where the question is no longer if you should use a preprocessor, but which one you should use. It turns out, the answer to that question is very often Sass — because the syntax is better (and closer to CSS), because it’s
How to Build a Better Button in CSS3 — SitePoint
tags rather than <input type="submit" /> but, whichever you prefer, the standard style follows your OS conventions. It can be a little uninspiring… Let’s build a better button using CSS3 styles, animations and transformations: View the button demonstration… The HTML No surprises here — we only require a single button tag: <button>Click me!</button> We’re going to apply our styles to every button b
The Beginner's Guide to JavaScript Date and Time
February 27, 2013JavaScript Date Object: The Beginner’s Guide to JavaScript Date and Time Date and time values are used for many important functions such as searching, validation, and report generation. There is no standard format for dates in web applications, as people in different time zones and countries prefer different formats. Therefore, adapting to any kind of date format can be a challeng
Unifying Touch and Mouse with Pointer Events — SitePoint
I often get questions from developers like, “with so many touch-enabled devices on phones and tablets, where do I start? ” and “what is the easiest way to build for touch-input?” Short answer: “It’s complex.” Surely there’s a more unified way to handle multi-touch input on the web – in modern, touch-enabled browsers or as a fallback for older browsers. In this article, I’d like to show you some br
Introducing the New HTML5 <main> Element — SitePoint
When was the last time we received a new element? HTML5 introduced just nine new structural tags and they’ve been stable for several years: section , article, aside, hgroup, header, footer, nav, figure and figcaption. There are another 20 or so content elements including video , audio, canvas, progress etc. Today, we have a new structural element to learn: <main> According to the recent W3C specif
CSS Techniques for Retina Displays — SitePoint
January 10, 2013CSS Techniques for Retina Displays As many people use their highly portable devices for work and play, device manufacturers seek to enhance their user experience, making their devices simultaneously more powerful and easier to use. Apple gave us a completely new line-up of products that introduced double density pixel screens, creating sharper images on smaller screens. Other devic
Advanced CSS3 2D and 3D Transform Techniques — SitePoint
Gone are the days of using Flash and GIF images for creating animated graphics. It is time to show off some of the best CSS3 capabilities. CSS3 transform has been there in the web for quite some time. Browsers like Mozilla, Google Chrome and Opera have full support for CSS3 2D and 3D transform techniques. In this article you will learn: CSS3 2D Transform Techniques CSS3 3D Transform Techniques Wha
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Intuitive Scrolling Interfaces with CSS Scroll Snap Points — SitePoint
Managing Dates and Times Using Moment.js — SitePoint
10 Tips for Developing Better jQuery Plugins — SitePoint