Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • August 26, 2021 at 8:23 pm #1318507
    xeovision

    Hallo,
    i would like to animate my portfolio items from bottom to up when scrolling / loading page.
    Exactly like here shown: Sample page

    Found this Solution but it wont work on the portfoli items… any idea or way how to animate them?

    August 30, 2021 at 5:46 am #1318907
    Ismael

    Hey Sebastian,

    Thank you for the inquiry.

    There is no option for it by default, but you might be able to use css animations to animate the portfolio items…

    Example:

    .grid-entry .inner-entry {
	position: relative;
	animation-duration: 2s;
	animation-name: slideup;
	animation-iteration-count: 1;
}

@keyframes slideup {
	10% {
		bottom: -500px;
	}

	100% {
		bottom: 0;	
	}
}

    Or adjust the options of the isotope script.

    // https://isotope.metafizzy.co/options.html#transitions

    You will have to modify the enfold/config-templatebuilder/avia-shortcodes/portfolio/portfolio.js file directly.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • The topic ‘Animate Portfolio items by CSS’ is closed to new replies.