TandemTables Forum
A collection of Page Transitions - Printable Version

+- TandemTables Forum (http://tandemtables.com/forum)
+-- Forum: Tandem Trends (/forumdisplay.php?fid=1)
+--- Forum: Code (/forumdisplay.php?fid=3)
+--- Thread: A collection of Page Transitions (/showthread.php?tid=17402)



A collection of Page Transitions - The Professor - 06-03-2019 12:52 PM

http://d21c.com/leprofesseur/transitions.html


RE: A collection of Page Transitions - Linda - 06-03-2019 04:02 PM

Nice for a slideshow.


RE: A collection of Page Transitions - jawjahboy - 06-06-2019 12:51 AM

That's a lot of code. Here is a zip file with all the original components:

http://jawjahboy.com/scripts/PageTransitions.zip

Are there any simpler codes for wipers or fades that work on current browsers?

(06-03-2019 12:52 PM)The Professor Wrote:  http://d21c.com/leprofesseur/transitions.html



RE: A collection of Page Transitions - The Professor - 06-06-2019 12:58 PM

(06-06-2019 12:51 AM)jawjahboy Wrote:  That's a lot of code. Here is a zip file with all the original components:

http://jawjahboy.com/scripts/PageTransitions.zip

Are there any simpler codes for wipers or fades that work on current browsers?

(06-03-2019 12:52 PM)The Professor Wrote:  http://d21c.com/leprofesseur/transitions.html
My great granddaughter

[code]<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 100px;
height: 100px;
background-image: url("http://d21c.com/leprofesseur/lila/lila9.jpg");
-webkit-transition: width 3s; /* Safari */
-webkit-transition-delay: 1s; /* Safari */
transition: width 3s;
transition-delay: 1s;
}

div:hover {
width: 1080px; height: 1080px;
}
</style>
</head>
<body>


<p>Hover over the div element below, to see the transition effect:</p>

<div></div>



</body>
</html>
My HTML Test Bed


RE: A collection of Page Transitions - The Professor - 06-06-2019 04:38 PM

(06-03-2019 04:02 PM)Linda Wrote:  Nice for a slideshow.

http://d21c.com/leprofesseur/lila.html


RE: A collection of Page Transitions - Linda - 06-09-2019 08:48 PM

(06-06-2019 04:38 PM)The Professor Wrote:  
(06-03-2019 04:02 PM)Linda Wrote:  Nice for a slideshow.

http://d21c.com/leprofesseur/lila.html

Wow, that is very different. Nice pics, cute.


RE: A collection of Page Transitions - tonebytone - 06-10-2019 11:35 AM

Prof - do we need to add that /* Safari */ to make it work for mac computers? If this is omitted, then this code is only for Windows?


RE: A collection of Page Transitions - The Professor - 06-10-2019 03:00 PM

(06-10-2019 11:35 AM)tonebytone Wrote:  Prof - do we need to add that /* Safari */ to make it work for mac computers? If this is omitted, then this code is only for Windows?

Without code code works for I.E. and Chrome. Mac Books need the Webkit added. "hover' attribute was used to create transition and transform effects which is not recognized by ipads or Iphones