/    Sign up×
Community /Pin to ProfileBookmark

Sliding effect between two websites. Possible or not ?

Copy linkTweet thisAlerts:
Sep 07.2011

The title says it all ?
I’m thinking about redesigning my website (should be time, after 6 years…). I’m planning on doing something a bit similar to what I did with flash for my other website ([url]http://www.zarkan.org[/url] a point&click / escape the room / website). In the flash website, there were some arrows on the sides to navigate through the room.
When I’m saying “similiar to”, of course I’m not asking about arrows… My flash website was actually a biiiiiiiig page, with a “container” navigating inside it, with coordonates corresponding to the different “rooms”.
I want to do the same for my html website, using jquery. (I’ll probably post cries for help in this forum about it in a few weeks…) I’d like to achieve a “camera hover” effect… (sorry, I’m bad at explaining, even in French…) So it would be as if the user if watching from above, and smoothly getting from a part of the website to another. This website : [url]http://www.webleeddesign.com[/url] does something similar, when you click on the different categories.

So, to the actual question… Once I’ve set my website to act like this, I would like to know if there would be a way to keep this effect when going to a subdomain (can’t really see how, but I’ve been away from webdesign for a looooong time). Maybe with a mockup on the main website, which is replaced after the “effect” is completed with the “real” thing, aka the subdomain website. Doable or not ?

Thanks for all advice !!!

to post a comment
JavaScript

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@infinityspiralSep 07.2011 — One thing you could try would be loading in your pages from different domains within an iframe inside a container div. That way you could fade between those container divs without reloading the page.
Copy linkTweet thisAlerts:
@Ness_du_FratauthorSep 07.2011 — I was under the impression that iframes were now a big no-no in webdesign... I think I stopped using them about 6 years ago at least...

But yeah, I see what you mean. Would the iframe be the only alternative to the page reloading thing ?
Copy linkTweet thisAlerts:
@infinityspiralSep 07.2011 — Yeah iframes are not super awesome, but they work for select usages like this one. Validation is just a tool after all, not the law. Your other alternative is to pull in content via some json data with ajax requests and then restyle items once they are injected into the dom. I know I have pulled in flickr images via their api in this way. That is going to be a pain going across domains though. I'm not sure if ajax calls fail for sub domains as well as domains, but you could give it a shot and might get lucky ? I haven't had good luck with that, but that doesn't mean it's not possible.
Copy linkTweet thisAlerts:
@Ness_du_FratauthorSep 07.2011 — Yeah, I know validation is not the law ^^ But still, iframe... I remember, when I had this stupid host (free host) and I bought a domain name, and the host didn't allow DNS redirection, so I had to use an iframe... bad. really bad. First of all, the URL stays the same all the time, that means if the user refreshes the page, blam, he comes back on the first page. And I think it's not that great for SEO either...

Cross domain, that's always difficult. My latest experiment with that was with actionscript, I had to get images that were on the SAME host, just inside another folder, and nooooo way, even after giving all the authorisations... Finally, I had to duplicate the whole thing and put it inside the folder where the flash website was...

I guess my solution (replacing an "image" with a "live website") was not really good either... I'm pretty sure there would be a lot of flickering, and it would probably be a disaster on slow connections...
×

Success!

Help @Ness_du_Frat spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...