Loading a tour from a preview image  

Share your tips and tricks here or get help with any Panotour problem!
No bug reports (of any kind) in this forum!
no avatar
JonathanT
New member
 
Posts: 9
Joined: Wed Apr 10, 2013 11:31 am

Loading a tour from a preview image

by JonathanT » Fri Jul 26, 2013 8:30 am

Hi All,

I want to achieve something similar to this but without using Panopress as the tour won't be hosted on a Wordpress site.
http://www.panopress.org/examples/pano2vr-examples/

Basically I want to display a preview image that when clicked gets replaced with the actual virtual tour.

I'm sure this is very simple to achieve but as I'm not a coder any guidance would be appreciated.

Thanks
Jonathan

User avatar
UK Pano
Member
 
Posts: 372
Joined: Thu May 14, 2009 3:25 pm
Location: Sunny South East UK

by UK Pano » Fri Jul 26, 2013 1:06 pm

Not an expert (and others will kindly advise me on this!) but perhaps it could be acheived through HTML linking the static image to a SWF window that is the same size and location as the static pic?
Canon 400D / Canon 24-105mm L / Sigma 8mm f3.5 FE / Sigma 10-20mm / Sigma 70-300mm / NN3 & R1 / PS CS2 / LR3 / Enfuse

User avatar
aaronpriest
Member
 
Posts: 168
Joined: Fri Mar 16, 2012 4:23 am
Location: Lee, Maine, USA

by aaronpriest » Fri Jul 26, 2013 1:39 pm

I never could get Panopress to scale responsively with my Wordpress theme, so I do something very similar. I create a preview image with a big play button in the middle via Photoshop, and link the static image to the virtual tour with a standard HTML link. This results in the tour playing full screen after clicking the preview photo in a new tab or window, but that suits me just fine. I'm sure there's a way to define a size and location in a frame or something if you didn't want it to open a new tab or window, but I'm not a coding expert.

no avatar
JonathanT
New member
 
Posts: 9
Joined: Wed Apr 10, 2013 11:31 am

by JonathanT » Sat Jul 27, 2013 12:33 am

UK Pano wrote:Not an expert (and others will kindly advise me on this!) but perhaps it could be acheived through HTML linking the static image to a SWF window that is the same size and location as the static pic?

Thanks for your response. I think this is the way to do it... I'm just not sure on what the code would be. Can anybody assist?

User avatar
Sam Rohn
Member
 
Posts: 40
Joined: Fri Mar 11, 2011 2:36 am
Location: Brooklyn, New York

by Sam Rohn » Sat Jul 27, 2013 4:37 am

try something like this to create an iframe that contains a jpg and a link to replace the jpg with a panorama, use absolute paths if necessary, adjust iframe size as needed

Code: Select all
<iframe src="path/my-pano.jpg" name="iframe-pano-1"></iframe>
<p><a href="path/my-pano.htm" target="iframe-pano-1">VIEW PANORAMA</a></p>

PanoPress is working fine in my testing w responsive wordpress themes, you need to set the height & width to 100% in panopress settings and add your own media queries to your css like this -

Code: Select all
@media screen and (min-width: 980px)
{
 .pp-embed
{
 height:800px !important;
 width:400px !important;
}
}

@media screen and (min-width: 1200px)
{
 .pp-embed
{
 height:1000px !important;
 width:500px !important;
}
}

// etc...

you will need to specify queries for different screen devices and sizes and set the heght and width as desired per query, don't forget the the "!important" declaration

see these links for more media query examples and info

https://gist.github.com/marcobarbosa/798569

http://arcsec.ca/media-query-builder/

sam
Last edited by Sam Rohn on Sun Jul 28, 2013 7:51 am, edited 1 time in total.
Sam Rohn :: 360° Panoramic Photography :: www.samrohn.com :: Location Scout :: www.nylocations.com :: New York City
PanoPress :: WordPress Plugin for 360° Panoramas in Flash & HTML5 :: www.panopress.org


Return to Using Panotour / Panotour Pro 1.8

Who is online

Users browsing this forum: No registered users and 2 guests