Website issues being displayed by Internet Explorer

Greetings! Let me begin by saying how wonderful this page is - I have already found many answers here before. Please forgive any errors in my English :)

In my efforts to optimize my website for SEO and increase its speed, I made several changes. The site is built on the Opencart 2 system with the Lamby theme and various modifications. However, it seems that one of these modifications may be causing issues when accessing this page in Internet Explorer.

The interesting thing is that I created another page for my girlfriend using the same Opencart theme, and there are no problems with Internet Explorer on her page (her URL: ). The issue arises only when accessing my main page in Internet Explorer, particularly on product pages and some category pages.

I have tried hiring individuals on platforms like Fiverr to address this problem, but unfortunately, none of them were successful or affordable given my limited budget. Now, I turn to you, knowledgeable CSS experts and internet masters, for your insights on fixing this issue. It appears to affect all versions of Internet Explorer.

This is quite troublesome as many of my customers still use IE... Thank you in advance for your assistance!

(I have searched for solutions myself, but as a beginner, I struggle to understand them)

cssinternet-exploreropencart2.x

Answer №1

I haven't delved deeply into the analysis of your issue, but it seems like Internet Explorer is consistently reporting one main error message: 

The value of the property '$' is null or undefined, not a Function object
. This indicates a potential problem with jQuery not loading correctly or a similar issue occurring.

Have you tried grouping all of your jQuery code within the $(document).ready(function() {}) function to see if that resolves the issue?

Answer №2

After experiencing and solving an issue with Internet Explorer, I wanted to share the solution in case it can help someone else in the future. I discovered that the addresses of scripts and links in the header should always begin with "..//catalog/......" It's crucial to have double dots before slashes for Internet Explorer to interpret it correctly as the root.

If you encounter a similar problem specific to Internet Explorer, try adding two dots at the beginning of the script address.

Page: Regards,

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Do the last block in the table occupy the remaining space in the row?

Trying to create an HTML email calendar and struggling with getting the last td to fill the remaining space without affecting the width of other rows. Is there a way to increase the width of just the 4th block on the last row to fill the empty space? Here ...

htmlcss

Ensure that the left div spans 100% of the width of the container, while the right div remains on the right side and maintains a

Is there a way to create an effect with a div where the left side is 100% and the right side stays fixed? <!DOCTYPE html> <html> <style> .left { width: 100%; float: left; border: #ccc solid 1px; } .right { width: 50px; float:left; border ...

csshtml

What is causing my navbar's 'ol' element to have a wider width than the

Hello, I have a navigation bar with a dropdown menu using ol. However, when I hover over the list items, the width of the list exceeds that of the ol element. I believe this is due to the white-space: nowrap CSS property, but I want the text in the dropdow ...

jqueryhtmlcss

Unable to achieve horizontal alignment with DIV element set as inline-block

Currently, I have five columns that are aligned using the display:inline-block. Everything seems to be working fine, but there's a peculiar issue that arises when I refresh the page multiple times. Occasionally, while the first column remains at the t ...

htmlcss

Arrange the elements within the anchor tag in a vertical line using Angular Material

Is there a way to style the elements within an anchor tag in Angular Material so that they display in a single line? I am looking for the CSS solution to achieve this outcome. This is my current HTML code: <a mat-list-item [routerLink]="['das ...

cssangularangular-material

Notification with jQuery

I am looking to display an alert message when val = -1. However, the issue I am facing is that this message always appears at the bottom of the page regardless of the value of val. if ($val == -1) echo ' <script> $( ...

phpjquerycsshtml

Tips for applying a CSS class with a smooth fade-out effect

In my Angular project, I am working on creating a custom notification component. Here is the template code I have so far: <aside *ngFor="let message of messages "> <div class="notification" style="position:fixed"> {{message.conten ...

htmlcss

Classic design of the shadow element

I have main.js and index.html below class CustomTagA extends HTMLElement { constructor() { super(); const shadow = this.attachShadow({mode: 'open'}); const wrapper = document.createElement('h1'); ...

javascripthtmlcssshadow-dom

Applying a translucent layer of color to a jpeg image to create a subtle background effect

I am attempting to create a semi-transparent, solid background color on top of an <img> tag, while still showing the original image underneath at the same ratio and size. Below is a snippet of the code I am working with (let me know if you need more ...

javascripthtmljquerycss

The presentation of an HTML table varies between Gmail and web browsers

<table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> <table width="100%" height="131" border="0" cellspacing="0" cellpadding="0"> <tr> <td wid ...

htmlcss

Prevent the cursor from exiting the div element when the tab key is pressed

Currently, I have implemented a search input box allowing users to either enter a value or select from a list of suggestions. The issue arises when the user selects an option using the tab key, as it causes the cursor to move outside the input box despite ...

cssreactjs

The implementation of @font-face is failing to display on all currently used web browsers

Hey there, I could really use some help with getting @font-face to work properly. Despite trying numerous solutions, I still seem to be missing something. If anyone can spot what I'm doing wrong, please let me know! @font-face { font-family: " ...

htmlcssfontsfont-face

What is the functionality of the CSS switch button?

I'm curious about how the cool turn on/off switch button actually works. Take a look at for reference. I'm interested in implementing a prevention check to confirm whether the user truly wants to switch the button. Here's a snippet of the ...

jquerycss

CSS is being affected by an HTML form's unintended margin

Something seems off with the alignment of my search bar. It's causing the horizontal line to shift down when I add it next to the vertical lines at the bottom. I've tried adjusting the padding, margins, and even played with positive and negative ...

htmlcss

What are the steps to incorporate fading effects into a jQuery popup box?

Currently, I have implemented a jQuery function to display a popup box using .show() and hide it using .hide(). Is there a way to incorporate charming animations such as fading into the popup box? // display pop up $('.mypopup').show(); // con ...

jqueryhtmlcss

Incorporate Bootstrap styling into a layout featuring a row containing numerous input fields

I need some help with styling using bootstrap 5. I have set up a codepen for reference: https://codepen.io/korazy/pen/xxmWGOx Here are the issues I am facing: The input height changes to match the row height when text wraps. How can I keep the input at ...

htmlcsstwitter-bootstrapuser-interfacebootstrap-5

What is the best way to make the children of a parent div focusable without including the grandchildren divs in the focus?

I want to ensure that only the children of the main div are able to receive focus, not the grandchildren. Here is an example: <div class="parent" > <div class="child1" > <!-- should be focused--> <div class="g ...

javascripthtmljquerycss

Is there a way for ResponsiveSlides to fade the pager without causing any disruption to the content below, all

I have been working with the Responsive Slides jQuery plugin and made some custom modifications. Everything is going smoothly, but I am facing an issue with getting the pager and next/prev controls to fade in when hovering over the container. Although I s ...

javascriptjquerycssresponsive-slides

Issue with Google Maps functionality within the jQuery easytabs platform

Upon clicking the contact tab, the gmaps loads but unfortunately only shows the left corner of the map. Quite intriguing... Any thoughts on how to fix this? Here is the corresponding jsfiddle This is the structure of my HTML code: <div id="menu-contai ...

jqueryhtmlcssgoogle-maps

The challenge of aligning widgets in bootstrap panels across different browsers

Incorporating angularjs and bootstrap3, I'm in search of the best way to center widgets within a panel and achieve responsive behavior. Interestingly, the results vary across browsers, particularly in Firefox. Within my code, I have 4 column divs str ...

htmlcssangularjstwitter-bootstrapfirefox