Articles tagged 'jquery'

  • Unit testing the jQuery Rambling Slider - CoffeeScript, Jasmine and node.js

    November 9, 2011


    This post was originally published in the Rambling Labs Blog on November 9, 2011.


    As you may know, I have been working lately on the jQuery Rambling Slider. One of my personal milestones with this project is to write as many unit tests as possible, so I began my research.

    Honestly, I didn’t know where to begin. I remember to have read once on twitter that someone was writing their tests with Jasmine and CoffeeScript, so that could be a good starting point (and it sounds really fun too!). I have worked with Jasmine before and it sure was a great experience. It’s yet another productivity tool made by the great Pivotal Labs guys.

    After googling for a while, I stumbled into a post from someone that was writing tests in Jasmine and node...

    Continue Reading →

  • Unit testing the jQuery Rambling Slider - Part 2 - The DOM, jQuery and node.js

    November 9, 2011


    This post was originally published in the Rambling Labs Blog on November 9, 2011.


    In order to continue to add tests to the jQuery Rambling Slider, I needed to test something against the DOM. Problem is, you don’t count with the DOM when you’re running the Jasmine tests from console. So what should I do?

    As expected, I found that there is a DOM emulator in node.js :D. Also, to test using jQuery I needed to download the corresponding node package. So I didn’t waste any time and went ahead to install them:

    npm install -g jsdom
    npm install -g jquery
    

    So now, I can write something like this in my src/jquery.plugins.coffee:

    (($) ->
      $.fn.reverse = [].reverse
    )(jQuery)
    

    And test it on my spec/jquery.plugins.spec.coffee with something like...

    Continue Reading →

  • jQuery Rambling Slider v0.1.1 is out!

    October 23, 2011


    This post was originally published in the Rambling Labs Blog on October 23, 2011.


    Yesterday, I released v0.1.0 of the jQuery Rambling Slider and, as it happens with with all software development, some bugs were found. But hey, I took the time to fix them and now the v0.1.1 is out!

    Among the fixed issues:

    • Some effects not working with the default settings.
    • Flaky ‘boxRandom’ effect (some boxes not showing).
    • Control Navigation not showing when styled to be outside of slider (negative margin and hidden overflow).

    Let me know if you find any other issues. Major refactoring is up for next release.


    UPDATE Version 0.1.2 was released.


    :D

  • jQuery Rambling Slider has been released!

    October 22, 2011


    This post was originally published in the Rambling Labs Blog on October 22, 2011.


    A while ago I was looking for a good image slider jQuery plugin to use on a project, and Nivo Slider turned out to be the best candidate. I made some modifications for my needs at the moment and issued a pull request, but had no luck. I also said that if my pull request didn’t get accepted or took too long to be accepted, I would release it myself.

    Guess what? I got tired of waiting, so here it is! I just uploaded my first stable release of the now called jQuery Rambling Slider. :)

    It’s still basically the same Nivo Slider with the tweaks I made in my fork. It’s now written in CoffeeScript, which I’m having a lot of fun with, while the compiled JavaScript...

    Continue Reading →

  • jQuery Nivo Slider and images of different size

    October 1, 2011


    This post was originally published in the Rambling Labs Blog on October 1, 2011.


    A couple of days ago, I needed to add a slideshow to a project that I’m currently working on.

    When I googled “jQuery Slider”, I found lots and lots of options. I checked some of them out one by one, and one by one I discarded them, because it lacked a feature I wanted or, if it had the feature, it lacked cool animations.

    I finally settled up for the Nivo Slider. But it had an issue. It used the images as the current background for the slider, which then meant that the images had to be the same size.

    That might be fine if you have someone that crops the images to the required size… But what if you’re doing a project where it’s the end users that are going...

    Continue Reading →

  • jQuery fadeIn and fadeOut: IE bug workaround

    September 26, 2011


    This post was originally published in the Rambling Labs Blog on September 26, 2011.


    I was trying to do some cool effect on a project I’m working on by fading in the front page. The trick looks really nice and it’s easy to implement.

    Just make the body hidden like this:

    <body style="display: none;">
    

    And in the JavaScript file do this:

    $(function(){
      $('body').fadeIn(2000);
    });
    

    Checked it out on Firefox and Chrome. It works perfectly, so smooth. And that’s it!… Or so I thought…

    Checked it out in IE 8 or less and, oh surprise, it doesn’t work. It fades in the background, but the rest of the page is shown with no transparency or fading in at all.

    But why?? Because some elements have a position: relative; or position: absolute; in their...

    Continue Reading →