Post Reply 
 
Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
A collection of Page Transitions
06-03-2019, 12:52 PM
Post: #1
A collection of Page Transitions
http://d21c.com/leprofesseur/transitions.html
Visit this user's website Find all posts by this user
Quote this message in a reply
06-03-2019, 04:02 PM
Post: #2
RE: A collection of Page Transitions
Nice for a slideshow.

LingoLinda

[Image: countup.php]

Visit this user's website Find all posts by this user
Quote this message in a reply
06-06-2019, 12:51 AM
Post: #3
RE: A collection of Page Transitions
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
Visit this user's website Find all posts by this user
Quote this message in a reply
06-06-2019, 12:58 PM (This post was last modified: 06-06-2019 01:07 PM by The Professor.)
Post: #4
RE: A collection of Page Transitions
(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
Visit this user's website Find all posts by this user
Quote this message in a reply
06-06-2019, 04:38 PM
Post: #5
RE: A collection of Page Transitions
(06-03-2019 04:02 PM)Linda Wrote:  Nice for a slideshow.

http://d21c.com/leprofesseur/lila.html
Visit this user's website Find all posts by this user
Quote this message in a reply
06-09-2019, 08:48 PM
Post: #6
RE: A collection of Page Transitions
(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.

LingoLinda

[Image: countup.php]

Visit this user's website Find all posts by this user
Quote this message in a reply
06-10-2019, 11:35 AM
Post: #7
RE: A collection of Page Transitions
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?
Find all posts by this user
Quote this message in a reply
06-10-2019, 03:00 PM
Post: #8
RE: A collection of Page Transitions
(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
Visit this user's website Find all posts by this user
Quote this message in a reply
Post Reply 


Forum Jump:


User(s) browsing this thread: 1 Guest(s)