Community Forums › Forums › Archived Forums › General Discussion › infinity pro – using jquery accordion
Tagged: infinity-pro accordion
- This topic has 7 replies, 2 voices, and was last updated 7 years, 2 months ago by Victor Font.
-
AuthorPosts
-
January 26, 2017 at 5:13 am #200048mrwilljacksonMember
Hi all,
I'm setting up some faq's with jquery accordion with infinity pro theme - which I've used on other genesis themes in the past. I have a slight problem that when expanded the accordion is overlapping the site footer. Has anyone else experienced this? - many thanks!
January 26, 2017 at 6:01 am #200051Victor FontModeratorPlease post a link to the page with the accordion.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?January 26, 2017 at 6:50 am #200060mrwilljacksonMemberHere you go:
http://helpful.mrwilljackson.com/preview/faqs/
The page loads with total vertical space to acommodate all panels (even though they're closed) if you resize the browser window then open some panels they overlap the footer. I expect I have missed some css but I cant seem to spot the problem - all feedback gratefully recieved!
January 26, 2017 at 5:42 pm #200091Victor FontModeratorCan't get past the maintenance screen. (Please visit the live website)
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?January 27, 2017 at 1:14 am #200104mrwilljacksonMemberthis bypasses the maintenance screen: http://helpful.mrwilljackson.com/preview/
then hover over 'about us' in the main nav and choose 'faqs'
many thanks
Will
January 27, 2017 at 7:46 am #200116Victor FontModeratorIt appears that the match-height jQuery script is setting a fixed height on the genesis-content element when the page loads. Removing the fixed height allows the accordions to expand the page normally without overflowing the footer. If you look into the child theme's global.js, the author decided to match the height of the content area to the height of the sidebar for every page. This is what is causing the FAQs page not to work properly.
Changing the match-height code in global.js to exclude the FAQs should work for you:
// Match height for content and sidebar. if ( ! $body.hasClass('page-template-faq-template') ) { $( '.content, .sidebar' ).matchHeight({ property: 'min-height' }); }
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?January 27, 2017 at 8:22 am #200120mrwilljacksonMemberHi Victor,
Thanks for this! in chrome your code produces :
Uncaught ReferenceError: $body is not definedshould the first line of your 'match height' replacement code be:
if ( $('body').hasClass('page-template-faq-template') ) {
BTW If I comment out the whole 'match height' lines the accordion seems to work fine and other pages don't seem affected. I was also getting the same problem using gravity forms which have various fields which expand.
I'll test out and see if things are ok without using the 'match height' js within global.js
January 27, 2017 at 8:39 am #200125Victor FontModeratorGood! You're on the right track.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet? -
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.