CSS3 HTML5 panorama viewer - html

I need your help for an university project.
I want to achieve the same result that you can see on this page.
I need to build a div with a panoramic image inside, that the user can navigate with the mouse controls and when an artwork is hovered/clicked, some informations about it pop out.
I have searched the web and there are a lot of plugins that should work well, but they don't give me the chance to implement the hover/click event to show the informations I want.
Some tutorials/suggestions about my problem? Do you think that this method could be a solution?
Thank you all!

Here it is, the solution I've been looking for!
http://www.openstudio.fr/jQuery-virtual-tour,67.html?lang=fr
Hope it helps anybody who has encountered the same problem!

Related

HTML Map Clickable

So I have been searching on google for over half an hour now trying to find an easy html clickable map without any JS if possible but I just can't find one that suits my needs. I just want it to be a map with all of the countries in a container or something so I can make a quiz for myself (I want my OWN one). I just thought it would be fun to try to make a quiz for myself but I just need a world map template.
I think MapBox Studio can help you.
https://www.mapbox.com/mapbox-studio/
It's easy to use, i don't need to explain a lot :)
I hope this is help you !

Html 5 Canvas Particle effect

hey guys I need guidance to recreate a wonder full effect which I saw in a website
Fifty-five.com . After the pre-load is over you will see the company's logo in a canvas.
I have have been successful in creating the particle in a canvas but what math goes into linking the particles to create a mesh like structure on mouse over the canvas ?
I have found this http://cssdeck.com/labs/html5-canvas-particles-web-matrix Maybe you can add some mouse interactivity. Please show here the final result.
NOTE: I am not expert in this thing.
Have a look at particles.js:
http://vincentgarreau.com/particles.js/
https://github.com/VincentGarreau/particles.js/
Their home page has a similar effect to that used on the Fifty-five.com site you mention.
You can enable "line_linked" to link the particles.
I hope this helps.

GWT Canvas Zoom & Pan with URLs

I found an answer to zooming and panning images efficiently in GWT, but does anyone know how to implement a HTML canvas zoom and pan with links in GWT?
i think this might help you. meanwhile im gonna try this as well since i also looking for it :P
https://code.google.com/p/gwt-examples/wiki/gwt_hmtl5#Image_Scale_/_Resize

CSS3 animations on scrolling/sliding

i would like to build myself an animation that if the user scrolls from top to button, somethings moves from left to right. I also wish to do a slider that shows some content after sliding.
My inspiration is from this side:
http://towncentrecarparks.com/tccp/infographic/index.php
Thanks for your examples/tutorial.
I briefed and managed the infographic you found - the devs are pleased to learn you found it interesting!
Our devs will actually be posting some handy tutorials showing how this type of work is created on our new blog at Parallax in the coming weeks/months.
Cheers
Alex

Any ideas on how to create a flying tile 3D transition just via script/classes?

Right guys,
I have been looking all over the internet for a tutorial to which will show me how to re-create this effect on images...
http://flash-effects.com/tutorial-image-transition-flying-tile-3d/
I dont want to install these 3rd party components, because the project I am working on at present, may in future need to be edited by other designers/developers.
Is there anyway to do this just via scripting???
Any feedback would be appreciated, im ideally looking for a tutorial...
Most of what you're looking for is here. Then download the Bitmap.zip example and look through it. Although I will reiterate what the page says, you really should buy the book. It's quite good and teaches a lot about Flash in general, not just game programming.
You'd still have to figure out how to randomize the height and width of the pieces, add an onClickListener, and then move the pieces. From the example you provided it looks like they're just moving them back and forth in a z-dimension.
Hope this helps.