New Plus Tutorial: Build an Awesome Calculator

New Plus Tutorial: Build an Awesome Popup jQuery Calculator

We’ve got a fantastic Plus tutorial for you this week, from Chris Coyier, of CSS-Tricks. In this tutorial and screencast, Chris will show you how to build a really neat jQuery calculator. Join Now!

Preview

“Sure is nice to have a letter opener right next to your mail basket, a shoehorn next to your loafers, and a flashlight by your nightstand. Likewise, it’s nice to have a calculator handy when you need to perform some math. This tutorial and download shows you how to put one right on any website.”

calculator

Join Tuts Plus

NETTUTS+ Screencasts and Bonus Tutorials

For those unfamiliar, the family of TUTS sites runs a premium membership service called “TUTSPLUS”. For $19 per month, you gain access to exclusive premium tutorials, screencasts, and freebies at nettuts+, psdtuts+, and vectortuts+! For the price of a pizza, you’ll learn from some of the best minds in the business. Join today!

  • Subscribe to the NETTUTS RSS Feed for more daily web development tuts and articles.


Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
  • Deddy

    Cool

    • http://www.pryde-design.co.uk Andrew Pryde

      Uncool.

      1. Interesting
      2. Done by one of my favourite authors on webdesign
      3. Paid subscription required :(

      @Prydie

  • http://twitter.com/nazmy_my Nazmy

    Got to join tuts plus soon

  • http://www.solutiondesigns.net Philo

    Looks Great!

  • Alex Korey

    normal

  • http://blog.insicdesigns.com insic

    holy awesome!

    • Rik Girbes

      i agree!

      BTW: your new site design is great!

    • http://www.pryde-design.co.uk Andrew Pryde

      I disagree but I do really like your site design :)

      @Prydie

      • Abhisek

        I disagree…the design is based on wp-remix.com’s wp premium theme but nowhere it is said or acknowledged. FAIL!

    • http://juarezpaf.com Juarez P. A. Filho

      I don’t see the video, but your new site design is Great. Congrats girl and very nice job there.

    • http://www.quizzpot.com crysfel

      i think it is a good design hehehehehe

      @nettuts: keep posting good stuff for free ;)

  • http://www.saroverhees.be Saro

    Very nice calculator!

  • http://eyoosuf.blogspot.com Yoosuf

    chriss on Net.Tuts?

    • http://snedekerdesignz.com/blog/ Craigsnedeker

      Kewlz!

  • http://snedekerdesignz.com/blog/ Craigsnedeker

    Looks sweeeet!

  • Danny

    Very cool.

  • http://www.aldrinponce.com weblizzer

    great cool

  • http://eyoosuf.blogspot.com/ M.A.Yoosuf

    u disrespected :Sm i was really happy when the video was streaming but finally i saw only see u later and bye bye :(

  • http://themeforest.net/user/JeffreyWay Jeffrey Way

    @M.A. – Sorry. :(

  • http://themeforest.net/user/JeffreyWay Jeffrey Way

    We spend a lot of money on these tutorials; that’s why we have to charge $3 per site.

  • http://www.quizzpot.com crysfel

    it looks good!! i like it

  • http://www.freshclickmedia.com Shane

    I’m sure the concepts covered in the video are fantastic – I don’t doubt that there’s some great CSS/jQuery in there.

    I do, however doubt the assumption that you’ll think ‘oh, I need a calculator on this page to work out a quick sum’ :)

    On another note, I did something similar with an iPhone style keyboard on a site I recently did. Some of the users didn’t have acess to physical keyboards but still needed to enter text on some pages. (Don’t ask ;)

  • Pingback: Daily Links | AndySowards.com :: Professional Web Design, Development, Programming, Hacks, Downloads, Math and being a Web 2.0 Hipster?

  • Pingback: My Bad Attitude » Build an Awesome Popup jQuery Calculator

  • http://jason-boyle.com Jason

    I’ll sign up when Jeffrey Way finishes the second part of his ‘Login System’ tutorial. *nudge nudge. :)

  • http://douglasheriot.com/ Douglas

    The design is just a rip off of Apple’s dashboard widget calculator (even close button X in the corner), but still interesting.

    I wish these plus tutorial previews had a live demo, but that would provide less reason for people to pay to see it.

  • http://www.amberweinberg.com Amber Weinberg

    Pretty nice. I’ve been collecting jQuery tutorials lately to jump into this summer once I finish with PHP ;)

  • http://ivorpadilla.com iPad

    Great tutorial, Chris Coyier as always surprising us =) Good work.

  • http://www.brandonlroach.com Brandon Roach

    Nice calculator, I love the final effect, it moved much smoother that I thought. Great job. :)

  • http://www.designbuddy.net Nicholas

    What a great Tutorial

  • Pingback: 25 Powerful and Useful jQuery Tutorials for Developers and Designers : Speckyboy Design Magazine

  • http://twitter.com/saurabhshah saurabh shah

    good one….

  • Pingback: 25 Powerful and Useful jQuery Tutorials for Developers and Designers | guidesigner.com

  • http://www.advise-art.com advise-art

    not bad …

  • Pingback: 25 Powerful and Useful jQuery Tutorials for Developers and Designers | designersmantra.com

  • Pingback: 25 Awesome jQuery Tutorials | Search-End

  • Pingback: HTML, CSS, PHP and jQuery Killer Tutorials | Evan Mullins Circlecube ReBlog

  • http://wwww.2topic.ir wallfa

    good script ajax

  • http://www.codehunterbd.wordpress.com Khairul Alam

    Nice tutorial and this is another great job.Thanks for this Nice calculator.

  • http://www.victoriaexpert.com Hary

    Awesome! This is what i am looking for. Thanks for the tutorial.