jQuery calculator not working on Mobile

happyagencies
Userlevel 3
Badge +1

Hey,
So we are working on a simple live calculator for this landing page: https://beta.6cmarketing.com/talent/

Screenshot_25

It is working on desktop but not on mobile devices 😦

I already tried to split the code in a desktop and a mobile version (just using different elements and repeating the same code) but not even that works.

This is the calc snippet:

(".calc-inputs").on('keyup change input', function(){ var earn = "" + ("#price").val() * 0.75 * ("#amount").val() + " “;
var minutes = 0.5 * ("#amount").val() + " minutes"; (”#earn-result").text(earn);
$("#minutes-result").text(minutes);})

/*$(".calc-inputs-mobile").on('keyup change input', function(){
        var earn-mobile = "$" + $("#price-mobile").val() * 0.75 * $("#amount-mobile").val() + "   ";
		var minutes-mobile = 0.5 * $("#amount-mobile").val() + "  minutes-mobile";
        $("#earn-result-mobile").text(earn-mobile);
		$("#minutes-result-mobile").text(minutes-mobile);})  */
</script>

This is the HTML content:

If I charge $              and complete             cameos.


I can earn about
$337 in 5 minutes.

any idea of what I am doing wrong?

NOTE: For some reason I cant paste formatted code here.

Thank you!

www.unbouncedesign.com

3 replies

mariana.reis 
<script>  
$(".calc-inputs").on('keyup change input', function(){
    var earn = "$" + $("#price").val() * 0.75 * $("#amount").val() + "   ";
		var minutes = 0.5 * $("#amount").val() + "  minutes";
    $("#earn-result").text(earn);
		$("#minutes-result").text(minutes);})  
  
/*$(".calc-inputs-mobile").on('keyup change', function(){
    var earn-mobile = "$" + $("#price-mobile").val() * 0.75 * $("#amount-mobile").val() + "   ";
		var minutes-mobile = 0.5 * $("#amount-mobile").val() + "  minutes-mobile";
    $("#earn-result-mobile").text(earn-mobile);
		$("#minutes-result-mobile").text(minutes-mobile);})  */
</script>`Preformatted text`
mariana.reis

Adding this extra snippets for Ary 🙂

mariana.reis 
<input type="number" class="calc-inputs-mobile" name="price-mobile" id="price-mobile" min="1" max="1000" value=5 placeholder="5">
<input type="number" class="calc-inputs-mobile" name="amount-mobile" id="amount-mobile" min="1" max="1000" value=5 placeholder="5">

Reply


Terms & ConditionsCookie settings