Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #576590

    Hi, it’s Naitik here.

    I have purchased Enfold and am a happy customer of it.

    I’m just wondering is it possible to have tab with cool jQuery sliding effect? For example I have image with hotspot just beside i have tab section i want to open different tabs while clinking on image hot spots.It’s done but issue is when someone click on image hotspot tabs are so much fast that user don’t know whether tabs changed or not.

    So i want to put simple slide effect which enhance user experience.

    In given website click on image(in third section) hot spot shows just above “regular” word and need to active regular deal tab(within the Same section).It works but user experience nothing.

    Please advise
    -Naitik Joshi

    #577925

    Namaste Naitik!

    How are you ? I’m viewing the site on my desktop so I see the hotspot image you are refering to on the left however when i view the site in tablet view it shows above the word “regular” however when I click on hotspot nothing happens what you can do is add tooltip info for hotspots. Hotspots cannot be linked to a slider without a lot of customisation which is out of support scope.

    Please check our demo here http://kriesi.at/themes/enfold/shortcodes/images-with-hotspots/ we can help you setup the same way.

    Best regards,
    Vinay Kashyap

    #578537

    Hi Kashyap,

    Thank for your reply.

    I just change tab control with slide because of issue but now i add tabs again please check when click on regular button tab-2 is activated but user don’t know if content is same there.

    So,What i want is to add some jQuery cool effect like slide tab,Flip,Fade etc…

    Thanks & Regards,
    -Naitik Joshi

    #579648

    Hey!

    it would require a huge amount of time and customization of the theme and that is why you would need to hire a freelance developer for this job.

    Best regards,
    Andy

    #579663

    Hi!

    You don’t need jQuery to do this. Just add the below code in Enfold > General Styling > Quick CSS

    
    /* Tab Animation */
    
    .active_tab_content {
       animation: scaleTabs 0.15s ease-in;
    }
    
    @keyframes scaleTabs {
        0% {
            opacity: 0;
        }
        1% {
            opacity: 0;
            transform: scale(0);
        }
        100% {
            opacity: 1;
            transform: scale(1);
        }
    }
    
    

    Regards,
    Vinay Kashyap

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.