Home Forums Porto Template Multiple flip slideshows

This topic contains 6 replies, has 2 voices, and was last updated by  veroniqueflassan 1 week ago. This post has been viewed 53 times

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #10029389

    veroniqueflassan
    Participant

    Hello! I wish I could have 2 flip-slideshows on the same page. When I do it only one shows (the 1st at the top of the page) and the other one not. Something to do with JS? Could you help? Many thanks and have a very nice day.

    Véronique



    Template Version: The last one
    #10029390

    veroniqueflassan
    Participant

    I wrote 2 different divs “fcSlideshow” and “fcSlideshow2” but do not know how to init and add this second div in the jquery.flipshow.js. Thank you again.

    Véronique


    #10029391

    veroniqueflassan
    Participant

    Hello again! I found what I was looking for un view.home.js and tried to write lines including both divs but could not succeed :

    /*
    Circle Slider
    */
    if ($.isFunction($.fn.flipshow)) {
    var circleContainer = $(‘#fcSlideshow2’),
    circleContainer = $(‘#fcSlideshow’);

    if (circleContainer.get(0)) {
    circleContainer.flipshow();

    setTimeout(function circleFlip() {
    circleContainer.data().flipshow._navigate(circleContainer.find(‘div.fc-right span:first’), ‘right’);
    setTimeout(circleFlip, 3000);
    }, 3000);
    }
    }

    /*

    I prefer to wait for your answer. Thank you very much. Véronique


    #10029396

    Support
    Keymaster

    Hello, sure, that’s correct, you just need to initialize the carousel with the JS script you mentioned above.

    Let me know if you need further assistance.

    Kind Regards,

    Jonas


    #10029402

    veroniqueflassan
    Participant

    Thank you! But in fact I do not know how to initialize the carousel. Can you tell me what I have to do? I wrote these lines in view.home.js but it does not change anything. Can you give me more details? Should I add lines at the end of the HTML page? Should I add lines in theme-init.js? Sorry for annoying you again but I need to know. Thank you!

    Véronique


    #10029403

    Support
    Keymaster

    Hello, OK, right.

    Please try to change the slider script (view.home.js) to this one:

    /*
    Circle Slider
    */
    if ($.isFunction($.fn.flipshow)) {
    	var circleContainer = $('.fc-slideshow');
    
    	$.each( circleContainer, function() {
    			
    		var $container = $(this);
    			
    		$container.flipshow();
    
    		setTimeout(function circleFlip() {
    			$container.data().flipshow._navigate($container.find('div.fc-right span:first'), 'right');
    			setTimeout(circleFlip, 3000);
    		}, 3000);
    		
    	});
    }

    So now you can add as many sliders as you want in the page.

    Please try that and let me know if you need further assistance.

    Kind Regards,

    Jonas


    #10029404

    veroniqueflassan
    Participant

    You are the best!!!! Thank you very much


Viewing 7 posts - 1 through 7 (of 7 total)