hello,
i'd like to make a "simple" pano with hotspots.
But when i click on a hotspot, i would like to have "layer" (or a div, or a frame or wathever it could be) displaying HTML informations, like a popup (not jumping to another area). For instance, if i click on a flower in a pano, i want to be able to display the name, the species, all kind of informations AND photos of it (some HTML).
How would you do this ?
is it something to add in the xml or in the js ?
Thanks in advance.
Very beginner question ! but not in examples...
-
-
hello,
i'd like to make a "simple" pano with hotspots.
But when i click on a hotspot, i would like to have "layer" (or a div, or a frame or wathever it could be) displaying HTML informations, like a popup (not jumping to another area). For instance, if i click on a flower in a pano, i want to be able to display the name, the species, all kind of informations AND photos of it (some HTML).
How would you do this ?
is it something to add in the xml or in the js ?
Thanks in advance.
addthen gen hotspot code automatically like image hotspot
Code
Display More<hotspot name="spot1" devices="all" url="skin/vtourskin_hotspot.png" keep="false" ath="16.988" atv="2.76" zoom="false" distorted="false" details="8" flying="0" width="128" height="112" scale="0.5" scale9grid="" scalechildren="false" rotate="0" rx="0" ry="0" rz="0" edge="top" ox="" oy="0" crop="" ondowncrop="" onovercrop="" visible="true" enabled="true" usecontentsize="false" handcursor="true" capture="true" children="true" maskchildren="false" zorder="0" alpha="1.00" autoalpha="false" blendmode="normal" effect="" smoothing="true" pixelhittest="false" refreshrate="auto" onloaded="" onover="" onhover="" onout="" ondown="" onup="" onclick="if(linkedscene, tween(scale,0.25,0.5); tween(oy,-20,0.5); tween(alpha,0,0.5); looktohotspot(); loadscene(get(linkedscene),null,MERGE,BLEND(1)); skin_updatescroll(); );" bgalpha="0" bgcapture="false" bgcolor="0" linkedscene="scene_a1kt" type="image" > </hotspot>
or polygonal hotspot
Code
Display More<hotspot name="hs1" devices="all" keep="false" visible="true" enabled="true" usecontentsize="false" handcursor="true" capture="true" children="true" maskchildren="false" zorder="0" fillcolor ="0xffffff" fillalpha ="0.00" borderwidth ="0.0" bordercolor ="0xffffff" borderalpha ="0.00" fillcolorhover="0xffffff" fillalphahover="0.10" borderwidthhover="4.0" bordercolorhover="0xffffff" borderalphahover="0.80" fadeintime="0.150" fadeouttime="0.300" fadeincurve="1.100" fadeoutcurve="0.700" onover="" onhover="" onout="" ondown="" onup="" onclick="" bgalpha="0" bgcapture="false" bgcolor="0" type="image" > <point ath=" 24.7278" atv=" 6.9091" /> <point ath=" 23.7732" atv=" 12.0665" /> <point ath=" 28.9287" atv=" 13.3020" /> <point ath=" 27.8078" atv=" 6.5071" /> </hotspot>
write onclick like this
add
Code
Display More<data name="defaultcss">a { text-decoration:underline; color:#110088; font-weight:bold; } a:hover { color:#885500; }</data> <data name="html_flower"> <p align="left"> <img src="flower.jpg" /> <font face="arial" size="+4"> <textformat leftmargin="10" rightmargin="10"> <br /> <b>Flower</b> <br /> <br /> flower sth blabla <br /> <br /> <br /> <br /> <br /> <br /> <br /> <a href="event:action(hidetextfield,flower);">close</a> </textformat> </font> </p> </data> <action name="showtextfield">tween(plugin[%1].alpha,0,0); set(plugin[%1].alpha,0); tween(plugin[%1].textblur,20,0); set(plugin[%1].textblur,20); tween(plugin[%1].blur,20,0); set(plugin[%1].blur,20); set(plugin[%1].enabled,true); set(plugin[%1].visible,true); tween(plugin[%1].alpha, 1, 0.25); tween(plugin[%1].textblur, 0, 0.25); tween(plugin[%1].blur, 0, 0.25);</action> <action name="hidetextfield">set(plugin[%1].enabled, false); tween(plugin[%1].alpha, 0, 0.25, default, plugin[%1].set(visible,false)); tween(plugin[%1].textblur, 20, 0.25, default); tween(plugin[%1].blur, 20, 0.25, default);</action> <plugin name="flower" visible="false" url="%SWFPATH%/plugins/textfield.swf" align="center" width="600" height="420" html="data:html_flower" css="data:defaultcss" background="true" />
-
Hi,
you can use following code for hotspot, instead of : XXXXXXXXXXXXXXXXXX you can write the text you want.
<hotspot name="spot1" style="hotspot_ani_white"
ath="239"atv="-3"
zoom="false"
onhover="showtext('XXXXXXXXXXXXXXXXXX-',hotspottextstyle);"
onclick="set(view.maxpixelzoom,null);
set(view.fovmin,30);
looktohotspot(get(name),20);loadscene(scene_Warehouse_A, null, MERGE, BLEND(2));
lookat(356, 0, 80);
wait(LOAD);
oninterrupt(break);wait(BLEND);
lookto(170, 1, 100, smooth(45,45,40));
"
/>
Participate now!
Don’t have an account yet? Register yourself now and be a part of our community!