Why isn't my jQuery code functioning properly on Weebly?

Hello, I'm a beginner in coding and have very limited skills in this area. However, I am able to install scripts on my Weebly site and have been doing so for some time now. Even though I can't code, I've managed to learn a few things along the way.

I recently purchased a slider code from codecanyon called "Lush Slider" and would like to install it on my site. Unfortunately, after uploading the .js and .css files, as well as the images, and creating the slider using a wysiwyg editor, I encountered an issue. Although I can see the images before publishing, they appear blank afterwards. I came across a suggestion that Weebly may have issues with certain characters like "$", which I am not familiar with. Can anyone help me identify what might be causing this problem?

Here is the code that I needed to insert into my footer:

<script>
  $(document).ready(function(){
  $('.lush-slider').lush({
     baseWidth: 1455
   , baseHeight: 450
  })
</script>

Thank you in advance for any assistance!

javascriptjqueryhtmlcssweebly

Answer №1

Consider utilizing the jQuery() method to retrieve it rather than $()

Answer №2

There seems to be a small error here - make sure you properly close the document ready declaration. Additionally, check if jQuery is included on your site either through a local reference or a CDN.

<script>
  $(document).ready(function(){
  $('.lush-slider').lush({
     baseWidth: 1455
   , baseHeight: 450
  }); // closes the lush method
}); //closes the document.ready
</script>

You can also refer to the documentation at this link () for further assistance in setting up and ensuring that the necessary files are being called in the correct order.

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

Smoothly transition between the new and existing child elements in a React component with a

Currently, I am utilizing a React component that renders a child element through props.children. The content within this child element varies dynamically. I am looking for the most effective method to smoothly transition (fade out the old element and fad ...

javascriptcssreactjs

How to design a custom <md-switch> with an icon in Angular Material

Is it possible to incorporate an icon into the md-switch component? I drew inspiration from a demonstration on www.inbox.google.com https://i.sstatic.net/qjw40.png Appreciate any advice or suggestions! ...

cssangular-material

Receiving alerts as soon as the page DOM is fully loaded, prior to the window.onload event

Is there a consistent way to get notified when the page body has loaded across all browsers, regardless of differences in implementation? Here are some methods I'm aware of: DOMContentLoaded: Supported in Mozilla, Opera 9, and newer WebKits. This i ...

javascriptdom

Adjusting a PHP variable based on the specific link that was clicked

I have implemented a loop to display a page with a list of users: foreach ($mytaxonomies as $mytaxonomy) : setup_postdata($mytaxonomy); echo $mytaxonomy->name; // display the user's name echo '<a>Send email</a>'; endfore ...

phpjquery

I am unsure of the timestamp format for the value 1522899000000. Can it be used in both Ionic and AngularJS? And how would one go

While parsing a JSON from an external URL, I came across a timestamp with the value starttime: 1522899000000 (on 4/5/2018 -> 5th April 2018). The value seemed like a Unix timestamp, but when I tried to convert it, it displayed the year 1912. What kind o ...

javascriptjavajsontimestamp

Delivering Access data in HTML format via email

In my MS Access database, I have a report that combines client records from one table (including email addresses) with grouped records fetched from other tables using a Query. I want to send this report directly to each client via email, within the body o ...

htmlvbams-access

How can I align a single button to the left side while positioning the rest of the elements to the right in Bootstrap 4?

I am attempting to align the B1 button on the left side and have the remaining elements positioned on the right side. Below is my code snippet using Bootstrap 4.1: <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/b ...

csstwitter-bootstrapbootstrap-4

Challenge encountered in Rails with Ajax altering image

I have a Ruby on Rails application and I've integrated the acts_as_votable gem for handling likes and unlikes. Users can like or unlike a post. I've implemented AJAX functionality to update the like count without refreshing the page, and it&apo ...

jqueryruby-on-railsrubyajax

Using ng-bind-html within a ng-repeat loop

Currently, I am working on developing a custom autosuggest feature where a web service is queried with a search term to retrieve a list of suggestions that are then displayed. My main obstacle lies in trying to highlight the matching term within the sugges ...

javascripthtmlangularjsfilterng-bind-html

RStudio Connect now automatically inserts CSS code into cells when updating

My current project involves creating an app for holiday requests. The main page of the app is displayed like this: https://i.sstatic.net/z2qma.png At the bottom right corner, you'll notice a column labeled "Accepted?" which displays either "OK" or " ...

cssrshinyrsconnect

The issue at hand involves Javascript, Ajax, latte, and Presenter where there seems to be a restriction on using GET requests for a file located

I have a query. I’ve been given the task of adding a new function to our web application. It was built on PHP by someone else, so it's proving quite challenging for me to debug as I am not familiar with this technology. I’m attempting to incorpor ...

javascriptajaxpresenternettelatte

What strategies can I implement to stop Iframes from disrupting the browser's history when interacting with them?

In my particular situation, I utilize Iframes to display Grafana on my page, which showcases beautiful and user-friendly graphs. After examining, I noticed that interactions like zooming in or out on the graph using mouse clicks trigger a type of refresh ...

javascripthtmlangulargrafana

Comparing HTML5 Drag and Drop to jQuery UI Drag and Drop: What's the Difference

In the ever-evolving world of web development, what is the most effective method for creating a drag and drop builder in 2017? While this question has been posed in the past (as seen here), technology changes rapidly. Is HTML5 still the go-to option, or ha ...

javascriptjqueryhtmljquery-uidrag-and-drop

Tips for inserting data into a PHP modal using MySQL and Ajax

Here is the code snippet I've written: <div class="container"> <div class="row"> <div class="col-md-3"> <div id="accordion" role="tablist" aria-multiselectable="true"> <div class="card"> ...

javascriptphpjquerymysqlajax

I'm encountering an error with the *ngIf directive in my Angular reactive form - any ideas on

Despite my reputation, I have a question that is causing me some confusion. I am trying to create a reactive form using an example on Stackblitz. While everything seems fine in Stackblitz and the code works correctly there, I encounter an error in VS Code ...

htmlangularangular-reactive-forms

Two-faced, object model in ThreeJS

Is there a way to render an obj model double-sided in three.js (r.84)? Below is the code snippet for loading the obj using obj loader: THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader() ); var mtlLoader = new THREE.MTLLoader(); mtlLoade ...

javascriptthree.js

Setting CSS attributes based on the parent node: What you need to know

Here is my CSS code snippet: .over_center { position:absolute; top: 50%; left:50%; height: 160px; /* two thirds (2/3) of parent size */ width: 160px; /* two thirds (2/3) of parent size */ margin-top: -80px; /* negative one third of parent size */ margin-l ...

htmlcss

Step-by-step guide on how to configure the URL path in an AJAX function call

How can I dynamically set the URL path in an AJAX function call when clicking on a page so that the page name is included in the URL? For example, if I click on a particular page (let's say the "ask" page on Stack Overflow), the URL should look like: ...

javascriptjqueryajaxasp.net-mvc-4

Modify Chartjs label color onClick while retaining hover functionality

Currently, I have implemented vue-chart-js along with the labels plugin for a donut chart. Everything is working well so far - when I click on a section of the donut chart, the background color changes as expected. However, I now want to also change the fo ...

javascriptvue.jschart.jsvue-chartjs

Trying to align a telerik component in a bootstrap modal

I'm struggling to align the radmediaplayer telerik control in the center, but I can't seem to get it right. Any assistance would be greatly appreciated. Thank you. <asp:Panel ID="pnlModal3" runat="server" role="dialog" CssClass="modal fade"&g ...

cssasp.nettelerik