Showing posts with label input. Show all posts
Showing posts with label input. Show all posts

02 March 2017

Pissing-me-off moving button

 

 Introduction

Another funny script. Each time you enter a button with your mouse, the button moves to a random location making it impossible to click. Can be very annoying. But a fun idea for April's fool!

Requirements

jQuery

Code

(function jumpingButton() {
        // getting window size
        var windowsize = { height: $(window).height(), width: $(window).width() };
        // affecting all buttons
        $('button, input[type="submit"], input[type="image"]').mouseover(function () {
            $(this).offset({
                top: Math.round(Math.random() * windowsize.height),
                left: Math.round(Math.random() * windowsize.width)
            });
        });
    })();

06 July 2016

Show everyone my passwords


 

 Introduction

Every seen this fancy checkbox on mobile devices where you can make password fields visible? Well on a page for a desktop browser it doesn't really make sense. But hey, I'll show you how to do it anyway.

How it works

With the help of jQuery we collect all the password fields. It's just a text-input-field of type password. If we change the type from 'password' to 'text' all user input will be visible.

Requirements

jQuery

Code

    // global variable to undo what we've done
    var pwFields = undefined;

    // this function does the magic
    function togglePWFields() {
        if (!pwFields) {
            // finding all pw-fields
            pwFields = $("input[type=password]");
            $(pwFields).each(function () {
                // convert all those fields to text-fields
                $(this).attr("type", "text");
            });
        }
        else {
            $(pwFields).each(function () {
                // undo all
                $(this).attr("type", "password");
            });
            // reset stuff
            pwFields = undefined;
        }
    }

31 March 2016

Validate a date - the simple way

 

 Introduction

How do you check if a date is valid? Let's see... Does the month selected has 30 or 31 days. But wait... there is the february it has only 28 days. And all 4 years there is a leap year. Except every 100 years. Pretty complex, isn't it?
But, there is a simple way!

How it works

Funny thing about Javascript is that you can create a date even with invalid values. It converts it into a valid date.
For example. If you want to create the date 32nd of March, it will make the 1st of April out if it. So all we have to do is to check if we get the date, we put in.

Requirements

None. Only JS itself.

Code

    function checkDate(year, month, day) {
        var d = new Date(year, month - 1, day);
        return d.getFullYear() == year && (d.getMonth() + 1) == month && d.getDate() == day;
    }

    checkDate(2016, 2, 28); // returns true
    checkDate(2016, 7, 35); // returns false

Amazon