You’ll need 3 things: HTML, CSS, and some JS. That’s it. Let’s do it.

<header>
    logo
</header>
<div id="sub_header">
    some sub header
</div>

Simple, just a header and sub header.

The CSS:

body { height:2000px; }
    header { height:52px; border-bottom:1px solid #000; padding:10px 0; }
    #sub_header { height:18px; border-bottom:1px solid #ccc; padding:5px 0; }
    #sub_header.sticky { position:fixed; top:0px; left:0px; right:0px; z-index:99999; }

Notice most of the fluff above is just for making it easier to see what’s happening, only interesting part is the #sub_header.active. It is responsible for making our sub header sticky once the jQuery tells it to (adds appropriate class).

And for the fun stuff:

$(function(){
    $(window).scroll(function(){
        // make sure you change 52 to your headers height plus your padding
        if ($(window).scrollTop() > 72) {
            $("#sub_header").addClass("sticky");
        } else {
            $("#sub_header").removeClass("sticky");
        }
    });
});

That’s about it. Here is example http://jsfiddle.net/HbVte/1/embedded/result/ scroll down to see the effect take place! Haven’t tested this on many browsers, but nothing in the css is that tricky, so I wouldn’t be surprised if this works all the way down to IE6.

Currently the set includes jSlider, jTabs, jPaginate, jSpotlight, jTip, jPlaceholder, and jCollapse. And if you look at our repository on Google we have quite a few more on their way. One of the most important things you should keep in mind is that even though some of our plugins may be already done around the web, we have made them only if they are less lines of code or if they offer more functionality!

We hope you give Vanity Toolset a try!

The Enavu Team

1. Google Docs – link

The Google document suite is just irreplaceable in our office, from sharing documents quickly and efficiently to editing them at the same time. This tool single handedly replaced Microsoft Office overnight for us, and besides the financial savings, it yields many other benefits that my company couldn’t live without.

2. Google Reader – link

The web is changing so fast, in the industry of web development there are new and important news every single day and you don’t want to be out of the loop. When a blog is posted and you are not subscribed to its RSS does that blog article still help you… no it doesn’t. So if you are not using RSS yet go ahead start, it will allow you to quickly skim through all the latest in any industry you want. Just go to your favorite websites and find their little RSS link. Google reader is honestly the best RSS reader by far, it allows you to keep track of everything, share with friends, and it just works.

3. Freedcamp – link

Project Management is an essential part of any business, keeping track of what’s happening and keeping everyone informed is a must. Freedcamp offers all of that for free in a beautiful package that anyone can start using today.

4. Wordpress – link

Whether you want to keep your customers informed or you want to make a simple website for your product with WordPress you can be up and running in hours (for beginners) or minutes (for experts). It has a theme/plugin that is right for you to help you do anything you may want to do!

5. Pandora – link

I know people may complain about adding a music streaming service in this list, but I can’t lie, I use Pandora 24/7 in the office and in my car and at home. It makes it easier to work, it makes everyone else happy… it’s a win win!

6. Alexa – link

There is no feeling like that of waking up and seeing that your Alexa world ranking dropped 10k overnight. Alexa does a terrific job of monitoring the internet and keeping records of which websites are doing good and which are not. It’s especially important for you as a web user or possibly a site owner to check your Alexa ranking once in a while.

7. WaveAccounting – link

WaveAccount is a beautiful FreshBooks replacement that like Freedcamp is absolutely free and awesome. WaveAccount will help you manage all those annoying things that accountants usually have to do for a bunch of money. It’s an amazing application, and its price tag is along enough to make you check it out right now.

8. Google Analytics – link

Knowing your audience is pretty much the first advice you will ever get from anyone in the Business industry. I have read countless books that start with some variation of “Know your audience”. With google analytics you can do just that by tracking the visitors of your website and seeing how your traffic is doing.

9. Beanstalkapp – link

You may have never heard of SVN, GIT, or Mercurial… that’s okay. What all of these Versioning systems allow you to do is keep a complete back up of your code/designs and so forth. You can see every step that was taking in modifying the Code and so forth. I promise you once in a while this is a Life Saver! Or if you just want to know who to blame for something that’s wrong with the code.

10. Gmail – link

The ultimate business user tool since 2005 (or at least that’s when i joined). Emailing has never been so powerful, fast, and free! We have thrown out Outlook a long time ago now, and haven’t missed it since.

We hope this list has been informative and helpful! Feel free to post comments with the applications you simply can’t live without!

Thanks

First of all let’s start by explaining what our criteria for a project management application are. The application needs to have a sleek and smooth interface that is easy for the user to navigate and use. The application must have a reasonable price tag, or be offered free. To make it in the top 10 the application needs to run fast and allow you to quickly do all your tasks. We have tried all of these applications so we are not just reading their press releases and feeding you with their bs marketing language.

Let’s get started!

• Freedcamp

  

  Freedcamp offers one of the cleanest interfaces and smoothest interactions (only competitors in that area goes to ApolloHQ who also have a very visually pleasing interface and very good interactions smoothness). The application offers the regular tools like To-Do’s, Discussions, Milestones, Files, Time Tracking, and Invoices. Where it really stands out is its Basecamp Import and the Meebo Chat bar which enables you to chat with all your existing messengers with your colleagues who may use Gtalk, ICQ, Facebook Chat, and many more. The application is young but it has a rapid growing feature list. The very best thing actually is not the features, or the beautiful interface, it’s the applications’ price tag… FREE! That’s right, this application launched a little over a month ago and has announced that it will remain completely free forever with unlimited users and projects! Something the rest of this list won’t offer.

• BasecampHQ

  

  Basecamp is the oldest and most trustworthy in this list. They have been around for a long time and have proven to maintain their application as simple as possible. Some find this quite annoying as they want a lot more functionality out of the system, others find it pleasing as it never gets too complicated. I will remain impartial to this, but will say that I think there are ways to add more features without burdening the users. The application has a very primitive design, same argument stays. So if you are ready to spend a whopping $20-$150 a month for a project management application this should be your first choice.

• ApolloHQ

  

  Apollo is a rather new project management application but it has quickly gained our respect with a decent set of features and a great interface. The biggest issue is they have blatantly offering the application for free, to soon release a set of payment plans that may kick their users out… who knows. Otherwise the application is worth a check, but personally i would wait until they annonce their plans. For a company to take months before releasing a price tag, it’s just scary to start using it.

• GoPlanApp

  

  GoPlan is a nice simple application with a nice interface. Their pricing is pretty fair, seems like the only draw back is the simplicity of the app which actually has offers less than BasecampHQ. But the application is definitely worth a mention.

• Huddle

  

  This application also holds a very special place in the PM world, I for one still find it hard to see the appeal. Especially at a price of $15/user/month, i find it almost slightly repulsive (not the website, but the actual application). It has some customization options that I can see are nicely setting them apart. But otherwise the time it takes you to learn to use this software is a cost i find much more gruesome than the $15 for every team member that joins.

Central Desktop



This application is scary familiar from BasecampHQ. What is worst is the price plan… that’s right i said price plan because it’s only one and it’s $99… that is quite confusing to me, but i’m sure they have some reason behind it. Other than that the design is much less appealing that most other apps on this list (except write… which is just awful). The main benefit of this application is the vast amount of features it has, so if you are looking to get a bunch of features into one application without a choice of having them or not this may be a great choice.

• Wrike

  

  I have tried using this application on multiple occasions and it makes no sense to me. The design is poor, the workflow seems confusing, and overall i’m really not sure how this is rated as one of the better project management applications. The only reason I have included this is because it holds a great respect in the pm world. I will continue trying to use it to find that WOW factor some are finding!

• 5pmweb

  

  This application reminds me of the Python programming languages. I have heard that you either love it or you hate it and no middle ground. And from my experience with it that is a correct statement. Personally i find it rather confusing, and overwhelming. And again there are a lot of people who find this application extremely useful and it works for them. The interface is so bold and in your face that i am a little worried to break something. The demo page took 4 minutes to load, and after a few refreshes it actually started working… so that wasn’t a great third experience withe app. But where this app really meets the rest is its pricing sheet which is no smaller than that of Basecamp or other competitors. Overall this may be the choice for you (if you like Python).

• TeamWorkPM

  

  This one is a little less known application, but not completely unknown. It has very similiar features and interface to that of Basecamp (just like a lot of the other apps on this list). It’s bold and in your face, but not in a good way. It works, but with that price tag you are better of wasting your money with basecamp. But overall it’s not an awful application or anything I just don’t see the wow factor.

Teamly



I hope no one gets mad about including this one. I personally don’t agree that this is a project management application… but they seem to say they are. At any rate, this overly simple application offers a very funky version of Task management. As far as i can tell they are free… but so are most other task applications around the web… at any rate i thought there may be people interested so i shared.

I would like to say that these are solely my views on these applications and if you disagree than that is your view and you are more than welcome to post them in the comments. Also feel free to suggest any other apps you think were worth making it in this list.

On January 31, 2011, free project management was released to the world. We had an amazing kick-off and greatly appreciate each and every person involved in helping us grow. We are very pleased to see all the feedback, it’s quite amazing to hear so many positive things! We are working hard to satisfy our users so please don’t hesitate to contact us—even if you would like to chat!

Please continue to help spread the word about us. Free project management is the future!

Like us on Facebook
Follow us on Twitter
Check out our Youtube Video

So without further ado here is my little trick that will automatically work for any situation!

$(document).ready(function(){
	$("input[type=text]:first").focus();
});

Pretty nifty little “plugin”. I’m sure you guys can use this in all kinds of situations!

Enjoy!

This year I have to say has really been the year to see progress in the field. Why is that, well because whether we like it or not everything is moving to the web. Of course the biggest reason for that is Google and their “It has to work in the browser” attitude. I was recently talking to a couple employees in google and they have confirmed my speculations that google is working hard to make everything play nice in the browser. So what does this mean? Well it means that HTML5 is now, even though we have to use all these Fallbacks for Internet Explorer we are still using the Video tag, and the Audio tag and all that good jazz. Of course all of this will be reflected in the upcoming release of 52framework which really supports it all. Another interesting observation is the drag and drop education our users have received. A few years ago we tried a drag and drop shopping cart and we managed to confuse the hell out of our users, but now they are more understanding of the concept. The upcoming release of the Enavu Networks free project management system uses a very good amount of drag and drop for its To-Do’s application. Why is drag and drop so important for the web, well it’s simple, we have been using dragging and dropping on our desktop for decades and now it’s finally making its way into our browser.

Other interesting developments in the web is the Virtual Desktop. I know I am a little biased on the subject because I have worked for AlwaysOnPC.com who actually offer your own virtual linux box that is accessible with every mobile device and browser. But besides my bias I just got an iPad and guess what, I keep accessing my iMac and MacBookPro with it. I also access my computer at work (dell something) with my iMac and use both screens on one window, it’s nice. Personally I really find this to be a huge move towards the real virtual desktop. With googles notebook that has no HardDrive the ability to access a computer equipped with everything you need is more and more important. So keep an eye for computers with less and less… and virtual solutions with more and more!

Have yourself a great 2011, by being in the Web Development Industry you are in the real center of things.

Sincerely,
Angel Grablev
(enavu president)

We noticed that our original post “Making a jQuery pagination system”received a lot of attention and a couple of people pointed towards some new features and making it into a plugin so we spent the past few days rewriting the code from scratch with some major improvements. Here is a sample implementation of the plugin:

HTML

<div id='content'>
    <p>1Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Vestibulum consectetur ipsum sit amet urna euismod imperdiet aliquam urna laoreet.</p>
    <p>Curabitur a ipsum ut elit porttitor egestas non vitae libero.</p>
    <p>Pellentesque ac sem ac sem tincidunt euismod.</p>
    <p>2Duis hendrerit purus vitae nibh tincidunt bibendum.</p>
    <p>Nullam in nisi sit amet velit placerat laoreet.</p>
    <p>Nulla sed purus et tellus convallis scelerisque.</p>
    <p>Nam at justo ut ante consectetur faucibus.</p>
    <p>Proin dapibus nisi a quam interdum lobortis.</p>
    <p>Nunc ornare nisi sed mi vehicula eu luctus mauris interdum.</p>
    <p>Mauris auctor suscipit tellus, at sodales nisi blandit sed.</p>
</div>

JavaScript

CSS

.pagination {list-style:none; margin:0px; padding:0px;}
.pagination li{float:left; margin:3px;}
.pagination li a{   display:block; padding:3px 5px; color:#fff; background-color:#44b0dd; text-decoration:none;}
.pagination li a.active {border:1px solid #000; color:#000; background-color:#fff;}
.pagination li a.inactive {background-color:#eee; color:#777; border:1px solid #ccc;}

That’s it!

Here is what the generated code will look like:

1Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Vestibulum consectetur ipsum sit amet urna euismod imperdiet aliquam urna laoreet.
Curabitur a ipsum ut elit porttitor egestas non vitae libero.
Pellentesque ac sem ac sem tincidunt euismod.
2Duis hendrerit purus vitae nibh tincidunt bibendum.
Nullam in nisi sit amet velit placerat laoreet.
Nulla sed purus et tellus convallis scelerisque.
Nam at justo ut ante consectetur faucibus.
Proin dapibus nisi a quam interdum lobortis.
Nunc ornare nisi sed mi vehicula eu luctus mauris interdum.
Mauris auctor suscipit tellus, at sodales nisi blandit sed.


Previous
1
2
3
Next

And here are the options for the plugin:

items = number of items to have per page on pagination
next = the text you want to have inside the text button
previous = the text you want in the previous button
active = the class you want the active paginaiton link to have
pagination_class = the class of the pagination element that is being generated for you to style
minimize = minimizing will limit the overall number of elements in the pagination links
nav_items = when minimize is set to true you can specify how many items to show
cookies = if you want to use cookies to remember which page the user is on, true by default
position = specify the position of the pagination, possible options: “before”, “after”, or “both” [added in version 0.2]
equal = implements an equal height main element by using the highest possible element use true false [added in version 0.3]
offset = unfortunately calculating heights with javascript isn’t always 100% accurate, so please use this value to make it perfect its defaultly set to 50 [added in version 0.3]

to pass them in simply follow the following syntax:

$("#content").jPaginate({items: 4, paginaton_class: "myownclass"});

that’s it, you have on the go pagination system with cookie support!