Hello guys, it’s Friday and there’s no better way to finish the week that offering you a big list with all our the latest web and design tools that have been included either in our webpage or our social streams, some of them include awesome plugins, web tools, freebies and more great things that can be helpful for every person involved in the web design field.
This week features some sparkling jQuery plugins, nice CSS3 deployments and helpful online tools for developers. Don’t forget that you can send us all your web / design-related news so we can feature them in our stream with the corresponding credits to the submitter.
This great jQuery plugin
grabs standard HTML nested lists and turns them into horizontal mega menus. With this plugin you can display all options simultaneously and every group can easily be customized with a bit of CSS, the plugin features a WordPress-powered version for all the lovers of this popular CMS. Among some of the features that you’ll find on this plugin we have:
- Establish the number of submenus in each row.
- Customize the drop down speed for very row of the menu.
- Switch between ‘slide’ or ‘fade’ animations.
This jQuery plugin
aids you with the automating process of any content’s formatting, saving you a considerable amount of time whilst offering you a wide range of features to work with columns.
Columnizer will automatically layout all your content in newspaper-like column format; you can also establish width values for your columns or leaving them static. Since the latest version, the plugin presents the following features:
- All the JavaScript events that were attached to content before adding the column format are now preserved for non-IE browsers.
- A new function name doneFunc has been incorporated, this option will be called when the columning process has been completed.
- Another new option named target that determines where the content should be columned. Since this version you’re able to put all of your content into a hidden div, and have it columned and displayed in it’s final location. This removes the content flicker when the page loads but isn’t still in columns
- ignoreImageLoading (on by default): When this option is set to false, Columnizer will try to wait until all images in the content are loaded so it can start the columning process. This can help conserve more consistent column heights for all data. The preferred fix is to always specify a width and height for your images in your columned content.
- The float option lets you specify “left” or “right” floating for columns. Handy for right-to-left languages or simply styling.
- With the lastNeverTallest Boolean option you can make sure that the last column isn’t going to be the tallest column.
Christian Krammer has brought to us
an extraordinary guide for better understanding CSS3. The guide parses all the major CSS3 properties and is up to date with the latest news (Firefox 4 is already featured).
You can read about background, borders, color, fonts (@font-face), gradients, shadows, transform and transition properties as well as the main subcategories for each property.
Adding zoom to your different elements is something that can always be helpful as it aids people to better visualize your contents. There are many different plugins and scripts that can help you with this and today we want to tell you about Zoomooz.
The plugin offers great support for all the latest webkit browsers, including Firefox 4. To understand its functionality we can say that
the plugin basically inserts a simple zoom on clicking to elements through the ‘zoomTarget‘ class.
Original link: Zoomooz
Every time you need to perform statistical operations the necessity of a dedicated statistical language to help you do things is evident. That process is effective but kind of archaic as it consumers a lot of time during its process.
Thanks to jStat it’s now possible to
execute complex statistical operations without appealing to dedicated statistical languages and therefore reducing your working times. jStat offers you a high maneuverability by letting you adjust different parameters to make the fittest graphics according to your needs.
Original link: jStat
Mosaic is a jQuery plugin developed to help developers
generate sliding boxes and captions with ease. The plugin also allows slide and fade animations with custom directions, preload images within boxes and work with a few properties such as Animation, speed, opacity, preload and more.
Original link: Mosaic!
Prior the CSS33 era working with gradients for web was a very tedious process that made us go back to the graphic program every time we saw something wrong in the design, increasing the working hours drastically and making the job something really boring.
Now with CSS3 you have the chance to work with gradients in real time without having to rely on graphic programs. This guide will help you understand how gradients work in CSS3 so you won’t ever need to go back to graphic software.
Every week we see designers and blogs releasing fantastic freebies for all of us, they’re usually great icon sets, layouts, templates and basically every design source that might be helpful for designers.
One of the best freebies released during these recent days was definitely Iconshock’s credit card icons. The set includes more than 450 payment and credit card icons in 9 different sizes, ranging from pixel perfect to vector versions.
Original files are included, both AI (vector sources) and PSD (pixel perfect files) so you can choose the most suitable option for your projects
Stacey is a lightweight CMS that stands out due the fact that
does not require a database setup nor installation files, you only have to drag the application to your server and you’re ready to go. All your content is handled by creating folders and working with text files. On the official page you will find all the instructions to implement Stacey on your server as well as installing templates, RSS / Atom support, working examples, latest news and support.
Original link: Stacey
Our friend Gilbert Sinnott is the mastermind behind Spritebox, an useful tool that lets you
make CSS classes and ID’s from an unique sprite image, making things much simpler for web designers and developers. The tool takes advantage of the background-position property to align specific areas of a sprite image into block elements of a webpage.
You will find many more great features whilst working with this tool, but however here’s a short list of some of the main features included in Spritebox:
- Utilize the Z key to activate the zoom mode.
- Press Shift + Z to indicate the zoom amount.
- Hitting the X key displays crosshairs.
- Use the main panel to determine different properties such as Mass and Repeat.
And this is it, a quick repass through some of the most relevant web and design news of the latest days,
don’t forget to check all our latest articles and follow us in Facebook and Twitter to find many more great resources and articles. We also like to remind you again that we’re receiving design news from all of you, so feel free to shot us an email with your recommendations.
