Sie sind nicht angemeldet.

Virtuelle Tour mit einem normalen Bild beginnen

asc

Anfänger

  • »asc« ist der Autor dieses Themas

Beiträge: 28

  • Nachricht senden

1

Donnerstag, 8. August 2013, 12:42

Virtuelle Tour mit einem normalen Bild beginnen

Hallo Leute!

Ich arbeite gerade an einer virtuellen Tour, welche ich mit einem normalen jpg-Bild beginnen möchte...
Gibt es innerhalb von krpano eine Möglichkeit dies zu realisieren, oder ist es einfacher, das Bild innerhalb einer html-Seite darzustellen und dann einfach durch einen Klick darauf erst den krpano-Player aufbauen zu lassen???

Danke für eure Tips....! *smile*
Grüsse, arion

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

2

Donnerstag, 8. August 2013, 14:34

Hi,

beides ist möglich,

z.B. einfach mittels <layer> ein Bild mittig anzeigen und bei Klick darauf die XML der Tour (oder die erste Szene) laden:

Quellcode

 
1
2
3

<krpano>
<layer name="intro" url="bild.jpg" align="center" width="100%" height="prop" onclick="loadpano(tour.xml);" />
</krpano>


Schöne Grüße,
Klaus

asc

Anfänger

  • »asc« ist der Autor dieses Themas

Beiträge: 28

  • Nachricht senden

3

Donnerstag, 8. August 2013, 22:04

Hallo Klaus,

vielen Dank für den Input!

Ich habe es nun so gelöst, dass ich von krpano aus mitels JavaScript und dem jQuery Plugin "Backstretch" (https://github.com/srobbin/jquery-backstretch ) mein Hintergrundbild in das <div id="krpanoSWFObject>...</div> geladen habe...
So war es mir möglich, das Bild IMMER Browserfüllend darzustellen, da das Plugin automatisch dessen Grösse anpasst!
Bei der von dir genannten Methode entstand unten und oben jeweils ein schwarzer Balken, wenn das Browserfenster zu schmal war.

Des Weiteren habe ich einen <layer> hinzugefügt, über welchen mittels 'onclick' die Tour gestartet wird...

So funktioniert es perfekt! *thumbsup*

Grüsse aus der Schweiz,
Arion

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

4

Freitag, 16. August 2013, 16:19

Hi,

so etwas wie 'Backstretch' lässt sich mit krpano alleine auch einfach machen:

Hier ein Beispiel mit Actions für 2 Fälle - entweder das Bild so einzupassen, das es keinen Rand gibt, oder immer das gesamte Bild sichtbar ist:

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

<scene name="scalebgimage">
        
    <layer name="bg" url="bg.jpg" align="center" enabled="false" onloaded="bg_automatic_scale()" />
                
    <events name="bg_scale" onresize="bg_automatic_scale();" />
                
    <action name="bg_automatic_scale">
        if(layer[bg].loaded,
            div(screenaspect, stagewidth, stageheight);
            div(imageaspect, layer[bg].imagewidth, layer[bg].imageheight);
            if(imageaspect GT screenaspect, 
                set(layer[bg].width,prop); set(layer[bg].height,100%);
              ,
                set(layer[bg].width,100%); set(layer[bg].height,prop);
             );
          );
    </action>
        
    <action name="bg_automatic_fit_inside">
        if(layer[bg].loaded,
            div(screenaspect, stagewidth, stageheight);
            div(imageaspect, layer[bg].imagewidth, layer[bg].imageheight);
            if(imageaspect GT screenaspect, 
                set(layer[bg].width,80%); set(layer[bg].height,prop);
              ,
                set(layer[bg].width,prop); set(layer[bg].height,80%);
             );
          );
    </action>

</scene>


Schöne Grüße,
Klaus

asc

Anfänger

  • »asc« ist der Autor dieses Themas

Beiträge: 28

  • Nachricht senden

5

Montag, 19. August 2013, 20:25

Ok, das ist die noch feinere Lösung...!
Bei meiner Variante wurde das Hintergrundbild bei flash leider nicht angezeigt - jetzt mit der ersten von dir genannten Möglichkeit ist es auch da sichtbar!

Vielen Dank dafür!!! *g*

Grüsse,
Arion

Ähnliche Themen