Problem with jquery, baffling issue
-
So I have a custom WP installed with a few popular plugins. I did have WHMCS Bridge installed too, but it was causing various hiccups. One of the options it had was a dropdown to choose whether to use WP or WHMCS’s jquery. I kept it as WP.
Now, my issue is my package slider (pricing slider) on one of my pages stopped working, the jquery is not kicking in after I uninstalled the WHMCS Bridge plugin. Isn’t that stupid? They’re not even related, but that lousy plugin caused something to go wrong. Once I reinstall it, the slider on my WordPress page works again. I’m baffled why.
I have this other plugin installed called “OH Add Script Header Footer” that basically allows you to insert your own header or footer code. This is where I have my script code (footer) for the VPS slider. It was working fine and does work fine when the the WHMCS bridge plugin is installed. I don’t want that plugin and they’re in no way related to each other. That plugin clearly caused some jquery mayhem here.
Would appreciate help.
My footer code that was working fine:
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <script> ( function($, undefined) { $.ui.slider.prototype.options = $.extend({}, $.ui.slider.prototype.options, { paddingMin: 0, paddingMax: 0 } ); $.ui.slider.prototype._refreshValue = function() { var oRange = this.options.range, o = this.options, self = this, animate = (!this._animateOff) ? o.animate : false, valPercent, _set = {}, elementWidth, elementHeight, paddingMinPercent, paddingMaxPercent, paddedBarPercent, lastValPercent, value, valueMin, valueMax; if (self.orientation === "horizontal") { elementWidth = this.element.outerWidth(); paddingMinPercent = o.paddingMin * 100 / elementWidth; paddedBarPercent = (elementWidth - (o.paddingMin + o.paddingMax)) * 100 / elementWidth; } else { elementHeight = this.element.outerHeight(); paddingMinPercent = o.paddingMin * 100 / elementHeight; paddedBarPercent = (elementHeight - (o.paddingMin + o.paddingMax)) * 100 / elementHeight; } if (this.options.values && this.options.values.length) { this.handles.each(function(i, j) { valPercent = ((self.values(i) - self._valueMin()) / (self._valueMax() - self._valueMin()) * 100) * paddedBarPercent / 100 + paddingMinPercent; _set[self.orientation === "horizontal" ? "left" : "bottom"] = valPercent + "%"; $(this).stop(1, 1)[animate ? "animate" : "css"](_set, o.animate); if (self.options.range === true) { if (self.orientation === "horizontal") { if (i === 0) { self.range.stop(1, 1)[animate ? "animate" : "css"]({ left: valPercent + "%" }, o.animate); } if (i === 1) { self.range[animate ? "animate" : "css"]({ width: (valPercent - lastValPercent) + "%" }, { queue: false, duration: o.animate }); } } else { if (i === 0) { self.range.stop(1, 1)[animate ? "animate" : "css"]({ bottom: (valPercent) + "%" }, o.animate); } if (i === 1) { self.range[animate ? "animate" : "css"]({ height: (valPercent - lastValPercent) + "%" }, { queue: false, duration: o.animate }); } } } lastValPercent = valPercent; }); } else { value = this.value(); valueMin = this._valueMin(); valueMax = this._valueMax(); valPercent = ((valueMax !== valueMin) ? (value - valueMin) / (valueMax - valueMin) * 100 : 0) * paddedBarPercent / 100 + paddingMinPercent; _set[self.orientation === "horizontal" ? "left" : "bottom"] = valPercent + "%"; this.handle.stop(1, 1)[animate ? "animate" : "css"](_set, o.animate); if (oRange === "min" && this.orientation === "horizontal") { this.range.stop(1, 1)[animate ? "animate" : "css"]({ width: valPercent + "%" }, o.animate); } if (oRange === "max" && this.orientation === "horizontal") { this.range[animate ? "animate" : "css"]({ width: (100 - valPercent) + "%" }, { queue: false, duration: o.animate }); } if (oRange === "min" && this.orientation === "vertical") { this.range.stop(1, 1)[animate ? "animate" : "css"]({ height: valPercent + "%" }, o.animate); } if (oRange === "max" && this.orientation === "vertical") { this.range[animate ? "animate" : "css"]({ height: (100 - valPercent) + "%" }, { queue: false, duration: o.animate }); } } }; $.ui.slider.prototype._normValueFromMouse = function(position) { var o = this.options, pixelTotal, pixelMouse, percentMouse, valueTotal, valueMouse; if (this.orientation === "horizontal") { pixelTotal = this.elementSize.width - (o.paddingMin + o.paddingMax); pixelMouse = position.x - this.elementOffset.left - o.paddingMin - (this._clickOffset ? this._clickOffset.left : 0); } else { pixelTotal = this.elementSize.height - (o.paddingMin + o.paddingMax); pixelMouse = position.y - this.elementOffset.top - o.paddingMin - (this._clickOffset ? this._clickOffset.top : 0); } percentMouse = (pixelMouse / pixelTotal); if (percentMouse > 1) { percentMouse = 1; } if (percentMouse < 0) { percentMouse = 0; } if (this.orientation === "vertical") { percentMouse = 1 - percentMouse; } valueTotal = this._valueMax() - this._valueMin(); valueMouse = this._valueMin() + percentMouse * valueTotal; return this._trimAlignValue(valueMouse); }; } )(jQuery); var planval = new Array('VPS1', 'VPS2', 'VPS3', 'VPS4', 'VPS5', 'VPS6', 'VPS7', 'VPS8'); //Hosting Plans Names. Displayed only to small screens var cpuval = new Array('1', '1', '2', '2', '3', '4', '6', '8'); //CPU array per plan var memoryval = new Array('512MB', '1GB', '1GB', '2GB', '3GB', '4GB', '6GB', '8GB'); //Memory array per plan var diskspaceval = new Array('5GB', '25GB', '50GB', '75GB', '100GB', '125GB', '150GB', '175GB'); //Disk Space array per plan var bandwidthval = new Array('250GB', '1TB', '1.5TB', '2TB', '3TB', '4TB', '5TB', '5TB'); //Bandwidth array per plan var decimalval = new Array('/mo', '/mo', '/mo', '/mo', '/mo', '/mo', '/mo', '/mo'); //Decimal array per plan var priceval = new Array('7', '15', '25', '35', '50', '75', '95', '125'); //Price array per plan var urlval = new Array('184', '165', '166', '167', '168', '185', '186', '187'); //WHMCS pid array per plan var finalurl = 'https://www.mydomain.com/portal/cart.php?a=add&pid='; //Update "domain.com" with your WHMCS installation URL var starting_point = 2; //Where the slider stops on first page load. Ideal to sign a plan as popular. $(document).ready(function() { $("#vps-slider").slider({ range: 'min', animate: true, min: 1, max: 8, //Update this if you less or more plans paddingMin: 0, paddingMax: 0, slide: function(event, ui) { $('.vps-prices-container #disk_space_option span.how_much').html(diskspaceval[ui.value - 1]); $('.vps-prices-container #plan_option span.how_much').html(planval[ui.value - 1]); $('.vps-prices-container #cpu_option span.how_much').html(cpuval[ui.value - 1]); $('.vps-prices-container #memory_option span.how_much').html(memoryval[ui.value - 1]); $('.vps-prices-container #bandwidth_option span.how_much').html(bandwidthval[ui.value - 1]); $('.vps-prices-container #price_amount').html(priceval[ui.value - 1]); $('.vps-prices-container a.order-vps').attr('href', finalurl + urlval[ui.value - 1]); $('.vps-prices-container #decimal').html(decimalval[ui.value - 1]); }, change: function(event, ui) { $('.vps-prices-container #disk_space_option span.how_much').html(diskspaceval[ui.value - 1]); $('.vps-prices-container #plan_option span.how_much').html(planval[ui.value - 1]); $('.vps-prices-container #cpu_option span.how_much').html(cpuval[ui.value - 1]); $('.vps-prices-container #memory_option span.how_much').html(memoryval[ui.value - 1]); $('.vps-prices-container #bandwidth_option span.how_much').html(bandwidthval[ui.value - 1]); $('.vps-prices-container #price_amount').html(priceval[ui.value - 1]); $('.vps-prices-container a.order-vps').attr('href', finalurl + urlval[ui.value - 1]); $('.vps-prices-container #decimal').html(decimalval[ui.value - 1]); } }); $("#amount").val("$" + $("#vps-slider").slider("value")); $('#vps-slider').slider('value', starting_point); $('.vps-plan').click(function() { tt_amount = parseInt(this.id.slice(5)) + 1; $('#vps-slider').slider('how_much', tt_amount); }); }); </script>
Viewing 2 replies - 1 through 2 (of 2 total)
Viewing 2 replies - 1 through 2 (of 2 total)
The topic ‘Problem with jquery, baffling issue’ is closed to new replies.
