Hi!

To make changes on hover you have to add custom CSS unfortunately we cannot see your site to let you know exactly what changes you need to do. If you like to play with it on your own just right click inspect element and style the classes you require to change on hover.

Enable custom class theme support http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

Try these links http://stackoverflow.com/questions/9266669/div-hover-background-color-change

You can use a background overlay to darken or lighten the images and make the buttons will stand out.
You can also try giving each color section a different overlay color.

Best regards,
Vinay Kashyap

• This reply was modified 8 years, 9 months ago by Vinay.

Hey!

Please try this css to get a underline

.active-menu-item:before {
            content: '';
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            bottom: .5em;
            height: 2px;
            width: -0;
            background: red;
            transition: all 0.3s ease;
        }

Best regards,
Vinay Kashyap

Hey!

Glad we could help you with this. we really appreciate if you please rate our theme on themeforest :)

Please feel free to get in touch with us if you have any questions.

Thank you for using Enfold :)

Cheers!
Vinay Kashyap

Hi!

I checked the correct link (same link you mentioned in private) when i click the edit icon on the color section it still gives the same error I will ask one of my team members to have a look and keep you posted.

Best regards,
Vinay Kashyap

Hi Powtin!

Ok! we will help you with this customisation :)

Please add the below code at the bottom of functions.php

//One page nav highlight
 
function activateMenuItem(){
?>
<script>
     jQuery(document).scroll(function() {
     var sections = jQuery('.avia-section'),
         menu   = jQuery('.av-submenu-container'),        
         nav_height = menu.outerHeight();
         jQuery(window).on('scroll', function() {
            var cur_pos = jQuery(this).scrollTop();
            sections.each(function() {
                var top = jQuery(this).offset().top - 300,
                    bottom = top + jQuery(this).outerHeight();
                if (cur_pos >= top && cur_pos <= bottom) {
                    menu.find('a').removeClass('active-menu-item');                    
                    menu.find('a[href="#' + jQuery(this).attr('id') + '"]').addClass('active-menu-item');
                }
            });
        });
    });
 
</script>
<?php
}
add_action('wp_head', 'activateMenuItem');

Then add the below code in Enfold > General Styling > Quick CSS

/* Your css styles for active menu item*/
.active-menu-item {
 background:gold!important;
}

Regards,
Vinay Kashyap

Hey!

Please add the below css in Enfold > general > Quick CSS

/* Main menu active link */
li.current-menu-item {
  /* ADD YOUR CSS STYLES FOR ACTIVE MENU HERE*/
}

Regards,
Vinay Kashyap

• This reply was modified 8 years, 9 months ago by Vinay.

Hey!

Sorry for the delay..
we are working on your ticket please wait. We will update the results here soon.

The images size should be a perfect square for it took like a perfect circle.

Please create a new images size thats suits you well
use this plugin https://wordpress.org/plugins/simple-image-sizes/installation/

After you install it go to Settings > Media > Add new size

Regenerate Thumbnails.

Cheers!
Vinay Kashyap

• This reply was modified 8 years, 9 months ago by Vinay.

Hi!

We have update the site with the new code and everything looks good to me. Please check it out and let us know how you like it :)

Below is the modified code in functions.php

// lightbox fullsize
function lightbox_fullsize(){
?>
<script>
    jQuery(document).ready(function() {         
        jQuery('.avia-gallery-thumb').on('click',' a',function(){
            jQuery(document).find('.mfp-wrap figure img').css("max-height","");
        });  
        jQuery(document).on('click','.mfp-arrow',function(){
            setTimeout( function(){
                    jQuery(document).find('.mfp-wrap figure img').css("max-height","");                                   
                }, 180); 
        });
    });

</script>
<?php
}
add_action('wp_head', 'lightbox_fullsize');

Cheers!
Vinay Kashyap

Hi!

When we try to check the options set in advance layout builder for the video section this is the screen that appears. May I know if the username you created have full administrator role ? It is possible one of the security plugins is blocking us from viewing the advance layout builder options for the color section or the Farb Section.

Regards,
Vinay

• This reply was modified 8 years, 9 months ago by Vinay.

Hi!

Please if you don’t mind create a new thread for new issues so we can relate to the original topics and not mix up issues in one ticket. That way we can help you better :)

Cheers!
Vinay

Hey!

Glad we could help! if you have any questions please feel free to get in touch with us.

Cheers!
Vinay

Hey!

We are working on your ticket please wait while we update the result here soon.

We have checked the menu and the menus are setup correctly.

A modified js code is added to functions.php

// Highlight one page nav

function activateMenuItem(){
?>
<script>
     jQuery(document).scroll(function() {
     	console.log('one page menu');
     var sections = jQuery('.avia-section'),
         menu   = jQuery('.av-submenu-container'),         
         nav_height = menu.outerHeight();
         jQuery(window).on('scroll', function() {
            var cur_pos = jQuery(this).scrollTop();
            sections.each(function() {
                var top = jQuery(this).offset().top - 300,
                    bottom = top + jQuery(this).outerHeight();
                if (cur_pos >= top && cur_pos <= bottom) {
                    menu.find('a').removeClass('active-menu-item');                    
                    menu.find('a[href="#' + jQuery(this).attr('id') + '"]').addClass('active-menu-item');
                }
            });
        });
    });
 
</script>
<?php
}
add_action('wp_head', 'activateMenuItem');

And the below css in quick css

/* Your css styles for active menu item*/
.active-menu-item {

background:#dfdfdf!important;
}

The problem still exist only on this page mentioned in private because when the #ID was added the # was left out please see screenshot. However we have created a new menu called research in appearance > menu and linked that menu to the page.

The issue seem to be in the page and only with 2 sections “Introduction” & “Features” please re-create check the #ID’s if you still have issue please re-create those sections on a draft page should fix the issue.

Regards,
Vinay

• This reply was modified 8 years, 9 months ago by Vinay.

Hey mdehart1!

Thank you for making the video :) Something has messed with the tooltip position hence on hover the tooltip comes in between mouse and the hotspot and the browser thinks the mouse is off the hotspot and cancel the hover state.

Please use this css in Enfold > General Styling Quick CSS

.avia-tooltip {
    margin-top: -70px!important;
}

Cheers!
Vinay

• This reply was modified 8 years, 9 months ago by Vinay.

Hi Ken!

To expand the menu bar please add this code to Enfold > General Styling > Quick CSS

/* Container width */

.container.av-logo-container{
   max-width: 100%!important;
   width: 100%!important;
}

If you still have issues please get back to us with a link to your site and a mockup so we can help you better.

Cheers!
Vinay

• This reply was modified 8 years, 9 months ago by Vinay.

Hi!

Customizing the theme to do what you are asking for is out of our support scope. but you can try a plugin like https://wordpress.org/plugins/wwm-social-share-on-image-hover/

Cheers!
Vinay

• This reply was modified 8 years, 9 months ago by Vinay.