non-CAPTCHA and Honey-pots

**athena** · 14 Feb 2019, 03:42 PM

I understand not wanting to style for IE but 18% of our users on our main site, (not the link I gave you-that is a test site)... 18% still use ms IE.. more than use FireFox. I can't go live with the slider until it works. What is happening is the count that changes with the slider is not showing the word "Human" but if you land on the number set in Admin the form works. In the "Value:25" displayed to the customer, the number 25 never changes with the slider like it does in FireFox. For anyone working on this here is the change I made to the css to get it to at least show up in IE

Code:

/* The slider itself */
.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 5px;
    border-radius: 5px;  
    background: #C90;  
    outline: 3px;
    opacity: .7;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

**davewest** · 14 Feb 2019, 04:49 PM

Originally Posted by athena

I understand not wanting to style for IE but 18% of our users on our main site, (not the link I gave you-that is a test site)... 18% still use ms IE.. more than use FireFox. I can't go live with the slider until it works. What is happening is the count that changes with the slider is not showing the word "Human" but if you land on the number set in Admin the form works. In the "Value:25" displayed to the customer, the number 25 never changes with the slider like it does in FireFox. For anyone working on this here is the change I made to the css to get it to at least show up in IE

Code:

/* The slider itself */
.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 5px;
    border-radius: 5px;  
    background: #C90;  
    outline: 3px;
    opacity: .7;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

Its not an issues designing for IE, I don't have access to MS products outside of VM. With any browser that supports HTML5, the slider should appear without any added css!

The value display is done with a jQuery script! if scripting is turned off or jQuery base not installed, then the word human or numbers would not get displayed or updated... The slider is just one of many styles of easy testing. You could use a simple question and answer input field for all as 2+2= Or not use any tests... the two hidden fields work grate without testing... One really don't need the slider!! I would be interested to see if your IE11 can see the slider on my site! I don't use the same css as what was sent in... We also have ways of working with IE bugs...

For info, -webkit-appearance: none; and -moz-appearance: none; is turning off the default browser css which means you need to design it yourself. Comment out the css and the default browser css takes over. For some good reading https://developer.mozilla.org/en-US/...CSS/appearance

**athena** · 14 Feb 2019, 05:34 PM

Thank you for the link... I'll work on understanding this... sorry for not getting that about the hidden fields. The spam has certainly stopped! Yes, your Contact Us form does look and act the same as in my IE 11 browser. Thank you for all your work on this and for sharing.

**davewest** · 14 Feb 2019, 08:10 PM

Originally Posted by athena

Thank you for the link... I'll work on understanding this... sorry for not getting that about the hidden fields. The spam has certainly stopped! Yes, your Contact Us form does look and act the same as in my IE 11 browser. Thank you for all your work on this and for sharing.

No problem... here's a fix for IE issues... others are reporting the same with other jQuery slider code.. Around IE 7 to current IE auto goes into compatibility (quirk) mode with just the <!DOCTYPE html>

The fix was found that adding the following meta tag resolved there issues... I just added to my own html_header.php file.

Code:

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

Give it a try and let me know...

**athena** · 14 Feb 2019, 09:28 PM

Darn... nope. I added "IE=11" and put it right under the head tag and tried again at the top of my meta tag list in my html_header.php with no change.

**athena** · 14 Feb 2019, 09:32 PM

On another note... will the hidden forms work if the slider is turned off in the admin?

**davewest** · 15 Feb 2019, 12:09 AM

Originally Posted by athena

On another note... will the hidden forms work if the slider is turned off in the admin?

The hidden fields always work, the slider can be turned off or commented out...

Investigating more, the styling of the slider in IE is possible, but the the way the slider fires in IE11 is different from the others and was listed as a bug in IE11. However, MS has changed everything around so hunting for more info is a pain...

Which explains why the script is not working as expected in IE11...

The numbers displayed at the slider button is IE idea of tool tips, which we can exploit simply by changing the text to 'please slide to the number 11!' By changing the human in admin to match the test number... I chanced mine to that.

**athena** · 15 Feb 2019, 06:17 PM

Well, played with that awhile but so happy no more Contact Us spam!! Love the hidden fields! Thank you again!

**OldNGrey** · 16 Feb 2019, 06:04 AM

V156a and non-CAPTCHA and Honey Pots and getting Internet Explorer to play nicely.

This what I have found:

IE defaults to compatibility (quirks) mode on local intranets. The way to overcome this is to add

Code:

<meta http-equiv=”x-ua-compatible” content=”IE=edge” />

to the html header for local development and testing only. Remove it for production systems. I added this to the file \includes\templates\MY-TEMPLATE\common\html_header.php.

IE and Edge both hide the slider ball (thumb) by placing it behind the slider bar.
Attachment 18337

IE does not execute js script that it does not like. There are no warnings and no errors.
IE seems to prefer onchange to oninput for detecting the movement of the slider.

I modified the non-CAPTCHA and Honey Pots js file for the contact_us page as this is the only one I use.

Code:

<script type="text/javascript">
$(document).ready(function () {
  
var slideCol = document.getElementById("id1");
var y = document.getElementById("f");

y.innerHTML = slideCol.value; // Display the default slider value
slideCol.onchange = displayCol; // IE prefers onchange so call the named function
// Update the current slider value (each time you drag the slider handle)
slideCol.oninput = displayCol; // call the named function
function displayCol() {        // name the function
    y.innerHTML = this.value;
	    if (this.value == "<?php echo SPAM_TEST; ?>") {
      y.innerHTML = "<?php echo SPAM_ANSWER; ?>";
    }     
	}
});

</script>

The other browsers and Edge still will work with this.

I use the ZCA_Bootsrap template you style sheet will be different.
I created another definition for thumb for IE

Code:

 .slider::-ms-thumb {
   -webkit-appearance: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background:  red;
    cursor: pointer;
   z-index: 900;
}

It is ugly as the bars in the slider are still visible but it works.

Thanks Dave for a great plugin.

environment Dev: WAMP 3.1.6; Zen Cart 156a; Apache 2.4.33; PHP 7.3.1; MySQL 5.7.21; Windows 10
environment Test: Zen Cart 156a; Apache 2.4.29; PHP 7.2.4; MySQL 5.7.24; Linux 4.15.0

**OldNGrey** · 16 Feb 2019, 06:19 AM

V156a and non-CAPTCHA and Honey Pots and getting Internet Explorer to play nicely.

This what I have found:

IE defaults to compatibility (quirks) mode on local intranets. The way to overcome this is to add

Code:

<meta http-equiv=”x-ua-compatible” content=”IE=edge” />

to the html header for local development and testing only. Remove it for production systems. I added this to the file \includes\templates\MY-TEMPLATE\common\html_header.php.

IE and Edge both hide the slider ball (thumb) by placing it behind the slider bar.
Attachment 18337

IE does not execute js script that it does not like. There are no warnings and no errors.
IE seems to prefer onchange to oninput for detecting the movement of the slider.

I modified the non-CAPTCHA and Honey Pots js file for the contact_us page as this is the only one I use.

Code:

<script type="text/javascript">
$(document).ready(function () {
  
var slideCol = document.getElementById("id1");
var y = document.getElementById("f");

y.innerHTML = slideCol.value; // Display the default slider value
slideCol.onchange = displayCol; // IE prefers onchange so call the named function
// Update the current slider value (each time you drag the slider handle)
slideCol.oninput = displayCol; // call the named function
function displayCol() {        // name the function
    y.innerHTML = this.value;
	    if (this.value == "<?php echo SPAM_TEST; ?>") {
      y.innerHTML = "<?php echo SPAM_ANSWER; ?>";
    }     
	}
});

</script>

The other browsers and Edge still will work with this.

I use the ZCA_Bootsrap template your style sheet will be different.

I deleted the slider height of 1px.

I created another definition for thumb for IE

Code:

 .slider::-ms-thumb {
   -webkit-appearance: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background:  red;
    cursor: pointer;
   z-index: 900;
}

It is ugly as the bars in the slider are still visible but it works.

Thanks Dave for a great plugin.

environment Dev: WAMP 3.1.6; Zen Cart 156a; Apache 2.4.33; PHP 7.3.1; MySQL 5.7.21; Windows 10
environment Test: Zen Cart 156a; Apache 2.4.29; PHP 7.2.4; MySQL 5.7.24; Linux 4.15.0

Thread: non-CAPTCHA and Honey-pots

Thread Tools

Search Thread

Display

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Re: non-CAPTCHA and Honey-pots

Similar Threads

v139h Contact Us Page Honey Pot Implementation On v1.39h

CAPTCHA Error: Session not started. The CAPTCHA cannot be used!

Best Captcha mod for FEC and login pages?

CAPTCHA AND Contact Us change

CAPTCHA using TTF & GD & Tel not Req on signup - CAPTCHA not showing on all pages

Bookmarks

Bookmarks

Posting Permissions