Adding custom jQuery and CSS on page not working
-
Hello,
I have two questions:
- I've been trying put these codes into my page, though it has not been successful. Am I missing something or putting it in the wrong place? The CSS is in "Custom CSS & HTML" > "Custom CSS", JS is in "Custom CSS & HTML" > "Custom <head> content", and the HTML is in the source code of the page itself.
- How do I make an onmouseout or mouseout function where when the mouse is no longer hovering the text, it goes back to the original white background?
Thank you very much in advance!
-
Dear @rothkuo
have a look here:
http://laytheme.com/documentation.html#custom-javascriptHope that helps :-)
Best!
Marius
-
NICE work!
-
Thank you! :-)
-
Hi Marius!
Thank you for the link. I swapped out "$" and replaced with "jQuery" as instructed. Since I am a novice to coding, Newpage Events is where I got lost. Do I use both of the "newpage" and "newpageshown" codes?
How would I incorporate the window.laytheme.on( with .mouseover function?
Any help would be appreciated!
Thank you,
Hannah -
Dear @rothkuo
see if this works for you:<script> jQuery(document).on("mouseenter", "YOURCLASSNAME", function(event) { alert("Hello Hannah!"); }); </script>
Let me know if that gor you further.
Best!
Marius
-
Hi Marius,
Thank you for your response. I put the code you provided into the Custom <head> content and for my text I tried by <p class="YOURCLASSNAME" and <a id="YOURCLASSNAME" in the source code section of my text.
It doesn't seem to work, am I doing something wrong?
-
-
I tried with the code within <body> tag but it is not working either.
-
Dear @rothkuo
can you get this code to work first?<script> jQuery(document).on("mouseenter", "YOURCLASSNAME", function(event) { alert("Hello Hannah!"); }); </script>
If you got this working I can help you further.
Have a look in the documentation.Best!
Marius
-
Hi @mariusjopen
Sorry if I am misunderstanding this, but I put the code you provided above in custom HTML for after <body>, and put a link with the class name on the about page, but it doesn't seem to be working. -
I am getting this error when I look at the javascript on the live page:
Is that related at all?
-
Dear @rothkuo
no. Thats not related I suppose.Can you send a link to your page with the installed code?
Best!
Marius
-
Hi @mariusjopen
Thanks for your help
I was able to figure it out with a different javascript:[code]jQuery(document).on("mouseover", "#ID", () => {
jQuery("body").css(
"background-image",
'url("IMG URL")'
);
})
.on("mouseleave", "#ID", () => {
jQuery("body").css("background-image", "none");
}); -
Before you post
Use the Search Feature. Maybe there is already a solution to your issue.
1. Update Lay Theme and all Lay Theme Addons
2. Disable all Plugins
3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
4. Now see if your problem solved itself
5. Go here, see if your problem is listed here:
Troubleshooting
When you post:
1. Post a link to where the problem is
2. If the problem is difficult to explain, post screenshots / link to a video to explain it