While recently updating a website to use some slick jQuery drop down menus, I encountered some errors related to conflicting jQuery and Javascript functions. Â The scripts worked by themselves, but not together, so it was obviously a conflict of some kind. Â Being a jQuery and Javascript noob myself, I was somewhat lost with what to do and where to find the conflicting code.
My hunt brought me to discover the error console in Safari’s Web Inspector which is part of the free Safari Developer Tools. Most major browser have their own developer tools. Most web developers speak very highly of Chrome and Firefox web developer tools. IE has developer tools as well, but IE deserves to go the way of the dinosaur, so I recommend developing for browsers that follow the W3C guidelines. Â The Web Inspector is a must-have tool for web-designers.
In my case, the error console was informing me that:TypeError: 'null' is not an object (evaluating '$("ul.menu li").hover'). It pointed to the 3rd line of my menu.js code. Not knowing what this meant, I did what any fledgling coder would do – Google’d it. Many google searches a number of variations of code placement later, I came to the conclusion (Thanks to Laumania.net’s post jQuery-Error:’null’ is null or not an object for turning me in the right direction). The solution, which may seem simple to an experience javascript coder, was that the my menu.js file was asking for $("ul.menu li").hover(function() { when it should have been asking for jQuery("ul.menu li").hover(function() {. There were multiple instances of this happening in menu.js, so I changed each call jQuery and that fixed the conflict.
Not that I have a deep understanding of this issue, but the problem as I see it was that menu.js was calling for a variable using the “$” sign. Naturally, it was unsuccessfully looking for “.hover” in my other javascript files. When it didn’t find “.hover”, an error was returned. But when I told menu.js to specifically look for it in jQuery, it quickly found the functions it was looking for. I’m sure someone smarter than me can share more thoughts on the subject.
Steck Insights Web Design seeks to provide professional, custom WordPress website solutions, quickly, efficiently and cost-effectively. You can count on us to follow web standards for safety, coding, SEO and speed.
Have you made fatal mistakes with your website? Fill in the form below to receive a comprehensive guide outlining the top 10 common website mistakes that you must avoid.
Branding InquiryFill out the form below if you're interested!
colorado, web design, design, advertising, brand, graphic design, denver, marketing, united states, web developer, content management system, search engine optimization, software engineering, email marketing, content marketing, wordpress, search engine, user experience, digital marketing, software, lead generation, experience, brand awareness, web development, website design, website development, colorado springs seo, development, digital marketing agency, custom web design, technology, target audience, domain name, mobile device, customer, usability, website, analytics, landing page, user experience design, internet, colorado springs web design, google analytics, conversion rate optimization, email address, marketing strategy, logo, management, hubspot, link building, reputation, online presence, business website, wordpress web design, web designers, wordpress website, web design agency, wordpress experts, affordable web design, web design services, web design seo, design services, web design company, web design web, small business marketing, web design colorado, keyword research, credibility, research, search engine marketing, javascript, responsive web design, user interface, customer service, competitor analysis, social media, html, attention, css, accessibility, organization, knowledge, content management, competitive advantage, navigation, strategy, google search, social media marketing
web development colorado springs, web design colorado springs, colorado springs web design, colorado springs website design, colorado springs web designers, website design colorado springs
Common Website Mistakes
When it comes to building a successful online presence, avoiding common website mistakes is crucial. Some of the most common mistakes include having a slow loading website, using outdated design elements, not optimizing for mobile devices, and neglecting search engine optimization (SEO). By addressing these issues and making necessary improvements, you can create a more user-friendly and effective website for your business.
Another common mistake is neglecting to regularly update and maintain your website. This can lead to security vulnerabilities, broken links, and outdated content that can turn away potential customers. By investing in a website maintenance plan, you can ensure that your website remains up-to-date, secure, and optimized for performance.