Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

IE Filters and Page Navigation 2

Status
Not open for further replies.
JavaStripped

JavaStripped

Programmer
Dec 18, 2002
84
0
0
CA
Is it possible to use IE filter transitions in hyperlinks to animate page transitions? All of the examples and tutorials I can find use transitions specifically for showing and hiding objects on the same page, and my experimentation is getting me nowhere.
[curse][hairpull3]

Thanks for any assistance!
[blues]

JavaStripped
"I did *not* escape. They gave me a day pass."
 
Sort by date Sort by votes
Well, there's good gnus and bad gnus...

The good news is that the links actually get to their intended destination pages now with no error messages. Many thanks!

The bad news is that the first transition and the intermediate page (the one with all the scripting, ironically) are not being displayed at all. I'm not sure if this is a bug (read: feature) in IE, or if there's still something we're missing. I'm going back to Microsoft's website to see if I can find anything on using sequences of transitions.

JavaStripped
"I did *not* escape. They gave me a day pass."
 
Upvote 0 Downvote
[hammer]
I don't know why I didn't think of this before, but what about using a pair of double quotes to replace the consecutive single quotes that create the parsing problem? I'll try that now... after I stop by microsoft.com.

JavaStripped
"I did *not* escape. They gave me a day pass."
 
Upvote 0 Downvote
I think that the location.replace must be loading before the transition takes place. So, if your transition is 3 seconds long:
Code: 
function findURL()
{
  var temp = getValue("page"), url = "";
  if (temp == "") url = "notfound.html";
  else url = "page" + temp + ".html";
  var transition = 3; // Number of seconds in transition
  setTimeout("window.location.replace('" + url + "')",transition * 1000);
}
// ...
<body onload="findURL();">

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Upvote 0 Downvote
Just got back from Microsoft's website; this page had some neat stuff, especially the bit about scripting sequences of transitions; URL . I downloaded the demo code and I'm going to play with it a bit to see if I can make it do what I want to do. I'll try your suggestion re: timing. Thanks again!

JavaStripped
&quot;I did *not* escape. They gave me a day pass.&quot;
 
Upvote 0 Downvote
Come back for anything else.

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Upvote 0 Downvote
One oddity: When I try to use IE5.5+ syntax:
[tt]DXImageTransform.Microsoft.Iris(irisstyle='CIRCLE', motion='in')[/tt] instead of '2', or
[tt]DXImageTransform.Microsoft.Iris(irisstyle='CIRCLE', motion='out')[/tt] instead of '3',
I get completely random transitions (barn door, slide, anything except the iris). Am I missing something in the exact usage of the new syntax?
Not a big deal; I'm still playing around with it. If I get the double-transition to work, I'll post my corrected code. Right now, it's still not doing the initial transition to black (the page-close transition), but the page-open transition is still working despite my repeated maiming of the code.
[noevil]


JavaStripped
&quot;I did *not* escape. They gave me a day pass.&quot;
 
Upvote 0 Downvote
What browser are you on? IE?
Did you try the timeouts?

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Upvote 0 Downvote
More good gnus!

Yes, I'm using IE (I wouldn't even be asking about the transitions in the first place otherwise).

The good news is that it works! The timeouts did the trick; I hadn't yet tried it until just now because I was dissecting Microsoft's demo code; turns out that they used much the same mechanism. It all works great now, except that I can't get the black screen pre-transition for the opening transition on the first page... but that's a necessary imperfection, I think, based on how the code works.

The JavaScript provided above is all good, after the two tweaks listed above with the findURL function and the original call from the HTML.

A note to those following in my footsteps and working with double-transition page swaps: DO NOT put transition code in the "intermission" page (the one that sets the background color of the transition). All of your transition code should be in the actual data pages. The only code I have in my "intermission" page is all of the JavaScript.

Once again, a big [2thumbsup] to chessbot for all the help, and I'm gonna have to hand out more medals, too; they won't let me give you any more stars.
[medal] [medal] [medal] [medal] [medal]

JavaStripped
&quot;I did *not* escape. They gave me a day pass.&quot;
 
Upvote 0 Downvote
Thanks! Glad it works.
Will treasure every medal [lol]
And yes, I shouldn't have asked about IE (getting desperate)

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Upvote 0 Downvote
Clarification: That's IE6 I'm using, and that's why I thought it was weird that the new syntax was giving me glitches. I'll just go back to my demo code downloads; I'm probably just missing something silly.

Thanks again to chessbot for keeping me from doing something [pc] I would have regretted.

JavaStripped
&quot;I did *not* escape. They gave me a day pass.&quot;
 
Upvote 0 Downvote
Just to follow up...
For the ~10% of users out there that disable javascript, your transition page will load, and then they will see a blank page. A suggestion:
Instead of calling with
Code: 
<a href="transition.html?page=newpage.html">New page</a>
call with an onclick, which will only fire if javascript is enabled:
Code: 
<a href="newpage.html" onclick="window.location.replace('transition.html?page=' + this.href); return false;">New page</a>

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Upvote 0 Downvote
Thanks for the JS-disabled workaround (not to mention all that other stuff); I think this thread has run its course now. Hopefully I can solve my CSS/IE filter issues now... at least I have time to work on them now that the transitions are fixed...
[hourglass]

JavaStripped
&quot;I did *not* escape. They gave me a day pass.&quot;
 
Upvote 0 Downvote
All right.

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

rogerte
  • Locked
  • Question
Code that works on Windows, Android and Iphone
Replies
0
Views
121
rogerte
rogerte
AbidingDude
  • Locked
  • Question
replaceChild() and Keeping Relationships
Replies
1
Views
136
AbidingDude
AbidingDude
penguinspeaks
  • Locked
  • Question
JS Open print dialog page to print a file
Replies
0
Views
63
penguinspeaks
penguinspeaks
edgarv
  • Locked
  • Question
Field with numbers and characters get nan
Replies
1
Views
60
ggriffit
ggriffit
chillay
  • Locked
  • Question
Add Control + F feature to a Web Page
Replies
3
Views
70
feherke
feherke

Part and Inventory Search

Sponsor

Back
Top