-
Posts
-
Hello. I have an element I’m adding to Enfold, using HTML, CSS and some custom JavaScript. I have everything but the JS in place and working. My site is still in local development.
How would I go about adding the following JS to the Enfold Child theme? Right now, the child theme Functions.php is at it’s defaults.
var svg = document.getElementById(‘menu’),
items = svg.querySelectorAll(‘.item’),
trigger = document.getElementById(‘trigger’),
label = trigger.querySelectorAll(‘#label’)[0],
open = true,
angle = 45;//set up event handler
trigger.addEventListener(‘click’, toggleMenu, false);
// svg.style.pointerEvents = “none”;//toggle menu when trigger is clicked
function toggleMenu(event) {
if (!event) var event = window.event;
event.stopPropagation();
open = !open;
if (open) {
var tl = new TimelineLite();
tl.to(items, 0.2, {scale:1, ease:Back.easeOut.config(4)}, 0.05);
for(var i=0; i<items.length; i++){
tl.to(items[i], 0.7, {rotation:-i*angle + “deg”, ease:Bounce.easeOut}, 0.35);
}
label.innerHTML = “-“;
svg.style.pointerEvents = “auto”;
} else {
var tl = new TimelineLite();
for(var i=0; i<items.length; i++){
tl.to(items[i], 0.3, {rotation: 0, ease:Circ.easeOut}, 0.05);
}
tl.to(items, .3, {scale:0, ease:Back.easeIn}, 0.3);
label.innerHTML = “+”;
svg.style.pointerEvents = “none”;
}}
svg.onclick = function (e) {
e.stopPropagation();
}
//close the nav when document is clicked
document.onclick = function () {
open = false;
var tl = new TimelineLite();
for(var i=0; i<items.length; i++){
tl.to(items[i], 0.3, {rotation: 0, ease:Circ.easeOut}, 0.05);
}
tl.to(items, .3, {scale:0, ease:Back.easeIn}, 0.3);
label.innerHTML = “+”;
svg.style.pointerEvents = “none”;
};Thank you,
RyanHi rlogan2334!
Please add your code to bottom of avia.js file and then add following code to Functions.php file of your child theme
function wp_change_aviajs() { wp_dequeue_script( 'avia-default' ); wp_enqueue_script( 'avia-default-child', get_stylesheet_directory_uri().'/js/avia.js', array('jquery'), 2, true ); } add_action( 'wp_print_scripts', 'wp_change_aviajs', 100 );Cheers!
YigitThanks for the quick reply. I keep getting the following error when I try to save the Child function.php
Parse error: syntax error, unexpected ‘{‘ in D:\InstantWP_4.4.2 – Enfold – Sandbox\iwpserver\htdocs\wordpress\wp-content\themes\enfold-child\functions.php on line 8
Current function.php
<?php/*
* Add your own functions here. You can also copy some of the theme functions into this file.
* WordPress will use those functions instead of the original functions then.
*/function wp_change_aviajs() {
wp_dequeue_script( ‘avia-default’ );
wp_enqueue_script( ‘avia-default-child’, get_stylesheet_directory_uri().’/js/avia.js’, array(‘jquery’), 2, true );
}add_action( ‘wp_print_scripts’, ‘wp_change_aviajs’, 100 );
Hey!
Do you mind creating a temporary admin login and posting it here privately please?
Cheers!
YigitI’m developing this locally at the moment. If need be, I can reproduce this site online later today.
All I did was paste in the code your provided. I’ve never touched the Child function.php until this morning.
- You must be logged in to reply to this topic.