awgeorge

awgeorge does not currently provide support for this item.

14 comments found.

Hello, we have a problem on Android and IOS browsers. The button show up normally and it visually changes on and off when slide or click. The only problem is that they dont work in the mobile browsers. So the buttons works visually but nothing happens. On the normal pc they work perfect in chrome and firefox etc. What can be the problem why it does not work on the mobile browsers Android and IOS?

How we call a function on click? the button has to work on all browsers of course also the mobile browsers.

Thanks so much in advance for your urgent reply!

This does seem a little odd. If the checkboxes are displaying then it means that there is no errors. It could be something to do with the touch events. Does your application override any of these events which would stop the event bubbling down to the checkbox?

If you have the latest version 1.2 then you can add to the onChange event of the checkbox. This calls when the checkbox has been checked/unchecked.

If you PM me your site: http://codecanyon.net/user/awgeorge (bottom right) I can take a look and debug with you.

William

dont work on android 4

I think we have one of those at work, I will check tomorrow when I have it in my hands. Do the checkbox show up and not slide? Or nothing at all?

checkbox show up but not correct and switching dont work

If possible, it would be amazing if you could send me a screenshot? Thank you for pointing this out :)will.george@me.com

I was hoping to trigger javascript functions when the buttons change state. I tried using the code below. It works the first two times the switch is moved (on, then off), but after that the behavior is a bit erratic, returning the wrong on/off state or in most cases with one click the page alerts both on and off messages before the switch is done moving. Any thoughts?

$(“input[type=checkbox]”).mobileCheckbox() $(“inputtype=’checkbox’).on(‘change’, function(e) { if($(this).is(“)) { alert(“ON”);} else { alert(“OFF”);} });

Awesome: To get your project on the way in jquery.mobileCheckbox.js line 137 change to:

//Set Handle Pos
$CheckboxHandle.animate({
    left:endPos
}, options.animation.duration, options.animation.easing, function(){
    $(element).trigger("complete");
});

This is uses the jQuery callback function tied into the animation, on complete it will trigger correctly for you.

I will submit the updated code to be available for all.

I have been thinking this one through and does seem a little silly having two callbacks, a complete and change. If you pm me i can give you the code i will upload to CC later. It just delays the call to change until the animation is complete.

Cheers W

By the way I updated line 137 as you mentioned, and it didn’t fix the issue. I’ll wait for you to send the updated code, and I’ll give it another shot.

Hi, did you release the new version?

Good evening. Shouldn’t be too long now, hope your project hasn’t been held up. If you are wishing to speed things up send me a PM.

William,

I’m working on a project that won’t be launched for 3 months, so I’m in no hurry. I appreciate the offer to speed things up if I was in a pinch. Take your time and I’m happy to purchase anytime. Mark

Hello. New version is online :)

The round and square slide switches display incorrectly in Opera and Safari. See screenshots…

A great resource you may want to check out is browsershots.org where you can see how your webpages or images display in all versions of all browsers, on all platforms and OS systems.

Author has fixed the above issue, in just a few hours. Very professional follow through.

This javascript looks great and I will be purchasing : – )

Author wrote: This is uses the jQuery callback function tied into the animation, on complete it will trigger correctly for you. I will submit the updated code to be available for all.
Author wrote: I have been thinking this one through and does seem a little silly having two callbacks, a complete and change. If you pm me i can give you the code i will upload to CC later. It just delays the call to change until the animation is complete. Cheers W

Hi,

1) Does the new version include the above mentioned changes? (the one that delays the call to change until the animation is complete)

2) What code do I use to go to a new webpage? (after click or animation complete)

3) I plan to use more than one ios checkbox on my webpage. Can each one trigger a separate event? (after click or animation complete)

If you could include a working example of this type of show/hide in the sample code you provide me, I would be forever grateful!

I have sent you a demo file that should help you out. Thank you for purchasing XD

Thank you. Best support ever!

William, this is an entirely different question so I’m creating a separate post.

o I would like the checkbox to say BEGINNER and ADVANCED.

o These words are longer than ON and OFF so I’m wondering whether your checkbox automatically adjusts it’s length based on length of the text?

o If not, then can I tweak the code to adjust the checkbox length?

o Can I control the color of BOTH sides of the checkbox? And color of the text?

Thank you! Mark B

Mark, The checkboxes do automatically grow depending on the text size. I may wish to use CSS to reduce the font size as well to make sure they are not overly big.

Within the JS code there is only a property to change the (on) background color. However, you can completely override the look and feel of the checkboxes with CSS so you can change the color of both sides and text.

Thank you. Just now purchased. Very simple to install and implement. Love it!

I have been working with the “mobileCheckbox.js” and everything is running ok. Even though i need to integrated it with an html file in order to leave it running with some other .js files.

To be clear i need to know how to get values from mobileCheckbox, I mean is that possible to use something like the following sentences:

$(“input[type=checkbox]”).text; $(“input[type=checkbox]”).value;

I need to know the value of the checkbox from javascript.

Best regards,

Have you tried the jQuery function .val()? If you wish to see if the checkbox is checked try .is(’:checked’)

How can I programmatically set status of checkbox? I tried following with no lucky. $(”#Checkbox2”).prop(‘checked’, ‘checked’); or $(”#Checkbox2”).prop(‘checked’, true);

Could you please give sample code? Thanks,

Hello,

You can change the status of the checkbox by using the API provided.

$(“input[type=’checkbox’]”).mobileCheckbox(“checked”, true);

You can also disable the checkbox this way:

$(“input[type=’checkbox’]”).mobileCheckbox(“disabled”, true);

Or Toggle:

$(“input[type=’checkbox’]”).mobileCheckbox(“toggle”);

Hey George,

I am trying to make different-sized switches for mobile and desktop… but I can’t figure out how to change the size of the switch via CSS only – is this possible? (You seem to indicate this is styleable via font-sizing?)

I changed the size of the MobileCheckboxContainer but then my Handle is not in the correct position.

Appreciate your help!

Good Morning,

Presently there is no redraw function on the checkboxes which means when you shrink the window and the CSS changes, the checkboxes will not change size. If this is a requirement I will take a look and check whether it is feasible.

Sizing of the checkboxes can be done with the font-size as the JS builds itself around the font-size you give it. If you need any help you can email me (through the button on the profile screen) and i can assist you further.

W

Thanks Very Useful tool to make PhoneGap and HTML5 apps with!

Hi there,

Very nice bit of code – I have one question for you. Is there anyway at all to make it so that once someone has clicked the button in one direction, it remembers. For example – If I wanted to install this on a member site and then have it so that it remembers that the user has clicked it and it remains the same every time the user logs in until he changes it again.

Is that possible?

Many thanks, Dan.

Certainly. Because the plugin sits on top of a standard checkbox, you can load the page with checked=”CHECKED” on the input field.

Because its an input, you can save the value in a database like you would on a normal form.

Hope this points you in the right direction :)

W

Hi awgeorge,

You write, “for perfect results use jQuery 1.8+”.

Can it be compatible with jquery 1.4.4.

Regards

Claude

Thank’s, i will

Claude

Hey,

Just to let you know that I have got the script working on jQuery 1.4.4 :)

I used the .delegate method instead of .on, also $.isNumeric needed defining.

If your still interested, I can send you the updated code after you’ve purchased.

W

Thank you very much sir, i will send you an email to receive your updated code.

Sincerly Claude

by
by
by
by
by
by