Hello again,
Just want to clarify, that I need a photographer to do work in the Lake Mooney area of Plattsburgh, New York. PM me if you're interested.
Thanks,
Robert
Hello again,
Just want to clarify, that I need a photographer to do work in the Lake Mooney area of Plattsburgh, New York. PM me if you're interested.
Thanks,
Robert
Hope it's ok to post here, but I have a need to outsource some work in the Plattsburgh NY - Lake Mooney Area. If you are interested in doing some sub work please let me know.
Thanks,
Robert
Sorry Umalo,
I'm not a programmer and what knowledge I do have is limited. What do I replace, what do I remove to add your example. Do I add it to the fix_infobox_aspectsize?? Do I remove some code. When I add it everything stays at .7 regardless.
Sorry very frustrated with more myself that I don't understand. I don't understand the correlation between plugin sizes and stage sizes especially when there are no height width settings and it is being retrieved in a statement based on the actual size of the image. Throw in mul and my brain hurts
I've attached the xml here if you wouldn't mind looking at it again.
Thanks,
Robert
Have you tried playing with:
https://krpano.com/docu/xml/#plugin.minwidth (minwidth, maxwidth, minheight, maxheight)
Yes I have and when I resize the browser it doesn't proportion and seems to get squished.
I guess I am not understanding the parameters to set.
Thanks, I will try your suggestion.
Robert
So I have been trying to get a good solution regarding resizing of an image based on the size of the browser. Andrey (Mindlessboss) has been great trying to help and I've found several different solutions but seem to have a common issue. Based on the code below, when the browser loads it is .7 of the screenheight and screenwidth. When the browser gets smaller it still maintains the .7. Simple right!
Problem I'm having is the .7 ratio is fine if you are on a typical laptop with a screen size of 1366 x 768, but when you're on a 27inch imac 2650 x 1440 the image is too big and even when you are on an iphone it shrinks too much.
So the question is how would or could I adapt the code to prevent the image from expanding beyond 1366 and prevent it from shrinking too much on an iphone?
I've tried different bits of code, but using if statements with stagewidth GT 800 etc.. creates other problems.
Thanks in advance for your help!
Robert
<info_box_settings infobox2screen_ratio="0.7" /> <!-- 0.7 = seventy percent of screenheight or screenwidth -->
<events name="infobox_events" keep="true"
onresize="infobox_image_adapt();"
onnewpano="close_info_box();"/>
<style name="pichotspot"
distorted="false" capture="false" zorder="1"
onclick="show_info_box();" url="skin/info2.png"
onloaded="if(ismobile,set(scale,1));" zoom="false" scale="0.4"
onhover="showtext(Click for more information,thumbtext3)"/>
<plugin name="infobox_image"
url="" align="center" keep="true"
alpha="1" scale="0" handcursor="false"
scalechildren="true" visible="true"
onloaded="set(infobox_image_loaded,true);
set(infobox_image_w,get(plugin[infobox_image].imagewidth));
set(infobox_image_h,get(plugin[infobox_image].imageheight));
infobox_image_adapt();" x="0" y="0" zorder="5" onhover="" onclick="" />
<plugin name="info_box_x"
url="images/close_btn.png" parent="infobox_image"
align="topright" keep="true" alpha="1" scale="1.5"
handcursor="true" visible="true" x="15" y="10" zorder="6" onhover=""
onclick="action(close_info_box);"/>
<action name="close_info_box">
tween(plugin[infobox_image].scale,0);
</action>
<action name="show_info_box">
set(plugin[infobox_image].scale,0);
txtadd(infobox_image_file_name,'images/',get(name),'.png');
set(plugin[infobox_image].url,get(infobox_image_file_name));
delayedcall(0.5,tween(plugin[infobox_image].scale,0.7););
</action>
<action name="infobox_image_adapt">
div(infobox_image_expected_aspect,get(infobox_image_w),get(infobox_image_h));
div(screen_expected_aspect,stagewidth,stageheight);
fix_infobox_aspectresize(infobox_image_expected_aspect,screen_expected_aspect);
</action>
<action name="fix_infobox_aspectresize">
if(%2 LE %1,mul(new_infobox_image_width,stagewidth,info_box_settings.infobox2screen_ratio);
set(plugin[infobox_image].width,get(new_infobox_image_width));
set(plugin[infobox_image].height,prop);
,
mul(new_infobox_image_height,stageheight,info_box_settings.infobox2screen_ratio);
set(plugin[infobox_image].height,get(new_infobox_image_height));
set(plugin[infobox_image].width,prop););
</action>
Display More
I'm also having a problem running a video on the ipad. On iphone or desktop it works. I did notice when using onvideocomplete it doesn't load, but when I simply use onclick with a toggle pause it does load and plays, but is erratic stop play behavior. I tried the suggested solutions without luck. Any word on a resolution?
Thanks,
Robert
Thanks Klaus
Sorry Klaus, Maybe I am speaking out of turn, but there are a lot of threads speaking about this issue on the forum. Here is one thread.
Here is a test link. Shadowbox Test
If you click on the fullscreen button and try to launch the shadowbox it does not appear until you return from fullscreen. Interestingly, if you use F11 to go into fullscreen it does appear.
So maybe I am confused but are we speaking about the same things. As well, others on the forum have said they solved the problem but it appears not to be working so one would have to say how did they get it to work?
Thanks,
Robert
Hello everyone,
I'm hoping someone can help me revisit this issue around launching a shadowbox while krpano is in full screen. I don't have any issue opening a shadowbox, but I have tried using wmode:"opaque" or transparent without success. I've also read here that a solution is to go out of full screen mode. How about the other way. Our client uses 720px x 480px as a standard window size. Klaus mentioned earlier that it is possible to detect their screen size and then open to that size without going to full screen? I don't know how to do that so is someone will to set that up and I will gladly pay for the code.
Thanks in advance,
Robert
Hello Klaus,
Could I ask you to explain a bit more how the tooltips_mapspots are supposed to work? do I have to set anything in the tour.xml under the scene or is it supposed to automatically pick
up the name from title? Same for the tooltips_hotspots.
Thanks in advance
Robert
<!-- set skin settings: bingmaps? gyro? -->
<skin_settings bingmaps="true" bingmaps_key="As_rw9I12krT1JZ8Waqx7Y8tw44_ywioT8xC35kN_uenTnAhVA8udZV7JuKCuvUp" bingmaps_zoombuttons="true"
gyro="true"
thumbswidth="120" thumbsheight="80" thumbspadding="10" thumbscrop="" thumbsopened="false"
tooltips_thumbs="false" tooltips_hotspots="true" tooltips_mapspots="true"
controlbar_offset="20"
/>
Resolved - Not sure why it is the case but it works all of a sudden. I had cleared cache several times. Only thing I did different was reboot my system and then it worked. Maybe the computer is as tired as I am .
Robert
I spent too much time trying yo figure this one out and read every solution there is but it still doesn't work. Have the absolute latest version of krpano and using the default vtourskin included. No matter what I set the zoom on flash it is always coming up at zoom level 16 and on ipad/iphone it is zoomed out all the way so you can see the entire earth.
Any suggestions would be most welcomed.
<layer name="skin_map" state="closed" url="" flash_url="%SWFPATH%/plugins/bingmaps.swf" html5_url="%SWFPATH%/plugins/bingmaps.js" visible="false" align="lefttop" width="100%" height="50%" x="0" y="0" zorder="1" lat="0" lng="0" setzoom="10" bgalpha="0" maptype="satellite" onmapready="skin_addmapspots();">
Thanks,
Robert
Sorry Klaus,
I don't understand what you mean and the explanation is somewhat cryptic. Do you mean fullscreensupport="android". Sorry if I'm being an idiot.
Robert
Not sure if any of the previous threads talking about css 3d transformations causes this issue but when I use chrome on the android tablet that i have it doesn't fully load all the tiles. I'm using the standard multires build.
<scene name="scene_pano1" title="Kitchen" onstart="" thumburl="panos/pano1.tiles/thumb.jpg" lat="" lng="" heading="">
<view hlookat="-58.71" vlookat="3.76" fovtype="HFOV" fov="100" fovmin="70" fovmax="120" />
<display details="22" stillquality10="HIGHSHARP" />
<preview url="panos/pano1.tiles/preview.jpg" />
<image type="CUBE" multires="true" tilesize="512" progressive="false">
<level tiledimagewidth="3386" tiledimageheight="3386">
<cube url="panos/pano1.tiles/l3_%s_%v_%h.jpg" />
</level>
<level tiledimagewidth="1693" tiledimageheight="1693">
<cube url="panos/pano1.tiles/l2_%s_%v_%h.jpg" />
</level>
<level tiledimagewidth="847" tiledimageheight="847">
<cube url="panos/pano1.tiles/l1_%s_%v_%h.jpg" />
</level>
<mobile>
<cube url="panos/pano1.tiles/mobile_%s.jpg" />
</mobile>
</image>
</scene>
Display More
I was wondering if anyone has successfully implemented the fullscreen button on an android tablet in html5. I'm using the 2012-10-05 build but not sure if I have to add something extra. I have a devices="html5" which works on chrome desktop and set devices="android" but it doesn't work on tablet
Thanks in advance.
Robert
Hello Tuur,
I've tried this but it doesn't seem to work. I seem to have to press the same button twice on each action to enable the touchtype and then the gyro. Any thoughts?
onclickA="action(moveto);set(onclick,onclickB());"
onclickB="action(drag2D);set(onclick,onclickC());"
onclickC="action(gyro_on);set(onclick,onclickA());" onclick="onclickA();"
<action name="drag2D">
set(control.touchtype,drag2D)
</action>
<action name="moveto">
set(control.touchtype,moveto)
</action>
<action name="gyro_on">
set(plugin[skin_gyro].enabled, true);
</action>
Display More
Not sure if anyone has tried this, but a client of mine would like to use one button to switch between drag2d, moveto and gyro for the ipad and iphone. Any hints would be great!
Thanks,
Robert
I'm having this problem as well! Mine is on Safari
Thanks
Hi Everyone,
I saw the thread regarding the scrollarea overflow and could get the solution to work that was proposed. I've set up both a scrollarea example and a scrollbox example. Below are the xml files.
You can see the working examples - scrollarea and scrollbox
The obvious issue with scrollarea is the overflow and would like to figure out if there is a simple way to stop it when scrolling to the second slide. The other issue I am having is the text boxes on both scrollarea and scrollbox. If you click on learn more on a PC/laptop the text looks like it should and the container holding the text is sized at height="95px" which brings it close to the bottom edge of the container. Now if you open either on a mac, the text actually looks smaller and is up away from the bottom of the container.
Hopefully someone has an idea
Thanks in advance,
Robert
Scrollarea XML
<hotspot name="info_01"
ath="0.0" atv="0.0"
zorder="10000"
scale=".75"
style="_hotspot_ani"
icon_type="info"
onclick="action(open_st);set(layer[frame].visible,true);tween(layer[frame].alpha,1,2);"
/>
<!--********** Container Holding ScrollArea, Images and Buttons **********-->
<layer name="frame" url="%CURRENTXML%/skin/win_bg.png" align="center" x="0" y="-15" width="699" height="370" zorder="10001" visible="false" alpha="0">
<layer name="frame_close_01" url="%CURRENTXML%/skin/skin.png" align="righttop" x="-14" y="-13" zorder="10001" crop="466|0|34|30" onclick="tween(layer[frame].alpha,0,.3,default,wait);action(close_st);set(layer[frame].visible,false);" />
<layer name="container" keep="true" type="container" align="center" y="0" width="675" height="346" zorder="10000" bgcolor="0xFFFFFF" bgalpha="0">
<layer name="scrollarea" url="%SWFPATH%/plugins/scrollarea.swf" alturl="%SWFPATH%/plugins/scrollarea.js" align="center" width="2065" height="346" direction="h" onloaded="setcenter(0,0);">
<layer name="image_01" url="%CURRENTXML%/images/exterior1.png" align="left" x="0" zorder="10006" onclick=""/>
<layer name="next_01" url="%CURRENTXML%/images/next.png" align="left" x="630" visible="true" alpha=".5" zorder="10007" scale=".75" onover="tween(layer[next_01].alpha,1)" onout="tween(layer[next_01].alpha,.5)" onclick="tween(layer[scrollarea].x, 0, distance(200,0.3));" />
<layer name="text_01" url="%CURRENTXML%/images/learnmore.png" align="leftbottom" x="0" y="30" width="100" height="50" zorder="10007" alpha=".5" onover="tween(layer[text_01].alpha,1)" onout="tween(layer[text_01].alpha,.5)" onclick="tween(layer[text_01].alpha,0,.3);tween(layer[text_01].x,-200,.5); tween(layer[cc_01].y,0)" />
<!--********** Container Holding Content **********-->
<layer name="cc_01" keep="true" type="container" align="leftbottom" x="0" y="-95" width="675" height="95" zorder="10007" bgcolor="0x000000" bgalpha=".5" visible="true">
<layer name="content_01" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="0" width="675" height="95" zorder="10007" html="data:test_text" css="data:test_css" background="false" backgroundcolor="0xFFFFFF" backgroundalpha="1.0" />
<layer name="close_01" url="%CURRENTXML%/skin/skin.png" align="righttop" x="0" y="0" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_01].alpha,1)" onout="tween(layer[close_01].alpha,.5)" onclick="tween(layer[cc_01].y,-95,);tween(layer[text_01].x,0,1,default, wait);tween(layer[text_01].alpha,1,.5,default, wait);" />
</layer>
<layer name="image_02" url="%CURRENTXML%/images/exterior1.png" align="left" x="695" zorder="10003" onclick=""/>
<layer name="previous_02" url="%CURRENTXML%/images/previous.png" align="center" x="-310" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[previous_02].alpha,1)" onout="tween(layer[previous_02].alpha,.5)" onclick="tween(layer[scrollarea].x, 695, distance(200,0.3));" /> <layer name="next_02" url="%CURRENTXML%/images/next.png" align="center" x="310" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[next_02].alpha,1)" onout="tween(layer[next_02].alpha,.5)" onclick="tween(layer[scrollarea].x, -695, distance(200,0.3));" />
<layer name="text_02" url="%CURRENTXML%/images/learnmore.png" align="leftbottom" x="695" y="30" width="100" height="50" zorder="10004" alpha=".5" onover="tween(layer[text_02].alpha,1)" onout="tween(layer[text_02].alpha,.5)" onclick="tween(layer[text_02].alpha,0,.3);tween(layer[text_02].x,495,.5); tween(layer[cc_02].y,0)"/>
<!--********** Container Holding Content **********-->
<layer name="cc_02" keep="true" type="container" align="leftbottom" x="695" y="-95" width="675" height="95" zorder="10004" bgcolor="0x000000" bgalpha=".5" visible="true">
<layer name="content_02" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="0" width="675" height="95" zorder="10004" children="false" html="data:test_text" css="data:test_css" autoheight="false" vcenter="false" background="false" backgroundcolor="0xFFFFFF" backgroundalpha="1.0" border="false" bordercolor="0x000000" borderalpha="1.0" borderwidth="1.0" roundedge="0" shadow="0.0" shadowrange="4.0" shadowangle="45" shadowcolor="0x000000" shadowalpha="1.0" textshadow="0.0" textshadowrange="4.0" textshadowangle="45" textshadowcolor="0x000000" textshadowalpha="1.0" />
<layer name="close_02" url="%CURRENTXML%/skin/skin.png" align="righttop" x="0" y="0" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_02].alpha,1)" onout="tween(layer[close_02].alpha,.5)" onclick="tween(layer[cc_02].y,-95);tween(layer[text_02].x,695,1,default,wait);tween(layer[text_02].alpha,1,.5,default, wait);" />
</layer>
<layer name="image_03" url="%CURRENTXML%/images/exterior1.png" align="left" x="1390" zorder="10001" onclick=""/>
<layer name="previous_03" url="%CURRENTXML%/images/previous.png" align="right" x="625" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[previous_03].alpha,1)" onout="tween(layer[previous_03].alpha,.5)" onclick="tween(layer[scrollarea].x, 0, distance(200,0.3));" />
<layer name="text_03" url="%CURRENTXML%/images/learnmore.png" align="leftbottom" x="1390" y="30" width="100" height="50" zorder="10002" alpha=".5" onover="tween(layer[text_03].alpha,1)" onout="tween(layer[text_03].alpha,.5)" onclick="tween(layer[text_03].alpha,0,.3);tween(layer[text_03].x,1190,.5); tween(layer[cc_03].y,0)"/>
<!--********** Container Holding Content **********-->
<layer name="cc_03" keep="true" type="container" align="leftbottom" x="1390" y="-95" width="675" height="95" zorder="10002" bgcolor="0x000000" bgalpha=".5" visible="true">
<layer name="content_03" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="0" width="675" height="95" zorder="10002" children="false" html="data:test_text" css="data:test_css" autoheight="false" vcenter="false" background="false" backgroundcolor="0xFFFFFF" backgroundalpha="1.0" border="false" bordercolor="0x000000" borderalpha="1.0" borderwidth="1.0" roundedge="0" shadow="0.0" shadowrange="4.0" shadowangle="45" shadowcolor="0x000000" shadowalpha="1.0" textshadow="0.0" textshadowrange="4.0" textshadowangle="45" textshadowcolor="0x000000" textshadowalpha="1.0" />
<layer name="close_03" url="%CURRENTXML%/skin/skin.png" align="righttop" x="0" y="0" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_03].alpha,1)" onout="tween(layer[close_03].alpha,.5)" onclick="tween(layer[cc_03].y,-95);tween(layer[text_03].x,1390,1,default,wait);tween(layer[text_03].alpha,1,.5,default,wait);" />
</layer>
</layer>
</layer>
</layer>
<data name="test_text">
<p style="color:#ffffff; font-family:Times; font-size:14px; padding:0px; margin:0px; margin-bottom:10px; text-align:left; text-shadow: #000000 0px 1px 0px">
<b>Image_Title</b>
</p>
<br/>
<p style="color:#ffffff; font-family:Times; font-size:12px; padding:0px; margin:0px; margin-bottom:10px; text-align:left; text-shadow: #000000 0px 1px 0px">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin at magna odio. Aenean euismod ipsum convallis libero posuere vel mattis nisi posuere. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam adipiscing semper lobortis. Aliquam porttitor convallis posuere. Mauris pretium erat sem, non posuere urna. Fusce pretium, lorem eget sodales ullamcorper, mi ligula porttitor augue, vel suscipit mauris enim in urna. Nam quis neque justo. Vivamus sed nibh sem. Nunc in risus nec erat consequat aliquet. </p>
</data>
<data name="test_css">
p {color:#ffffff; font-family:Times;}
a {color:#ffffff}
</data>
Display More
Scrollbox XML
<!--********** Container Holding ScrollArea, Images and Buttons **********-->
<layer name="frame" url="%CURRENTXML%/skin/default_black/win_bg.png" align="center" x="0" y="-15" width="699" height="370" zorder="10001" visible="false" alpha="0">
<layer name="frame_close_01" url="%CURRENTXML%/skin/default_black/skin.png" align="righttop" x="-14" y="-13" zorder="10001" crop="466|0|34|30" onclick="tween(layer[frame].alpha,0,.3,default,wait);action(close_st);set(layer[frame].visible,false);" />
<layer name="container" keep="true" type="container" align="center" y="0" width="675" height="346" zorder="10000" bgcolor="0xFFFFFF" bgalpha="0">
<layer name="scrollbox" type="container" align="center" width="675" height="346" zorder="10002" bgcolor="0x000000" bgalpha="0" maskchildren="true">
<layer name="img_layer_01" keep="true" type="container" align="center" x="0" y="0" width="675" height="346" zorder="10000" bgcolor="0xFFFFFF" bgalpha="0" >
<layer name="image_01" url="%CURRENTXML%/images/exterior1.png" align="left" x="0" zorder="10006" onclick=""/>
<layer name="next_01" url="%CURRENTXML%/images/next.png" parent="image_01" align="left" x="625" visible="true" alpha=".5" zorder="10007" scale=".75" onover="tween(layer[next_01].alpha,1)" onout="tween(layer[next_01].alpha,.5)" onclick="tween(layer[img_layer_01].x, -695);tween(layer[img_layer_02].x, 0)" />
<layer name="text_01" url="%CURRENTXML%/images/learnmore.png" parent="image_01" align="leftbottom" x="0" y="30" width="100" height="50" zorder="10007" alpha=".5" onover="tween(layer[text_01].alpha,1)" onout="tween(layer[text_01].alpha,.5)" onclick="tween(layer[text_01].alpha,0,.3);tween(layer[text_01].x,-200,.5); tween(layer[content_layer_01].y,0)" />
<!--********** Container Holding Content **********-->
<layer name="content_layer_01" type="container" parent="image_01" align="leftbottom" x="0" y="-95" width="675" height="95" zorder="10007" bgcolor="0x000000" bgalpha="0" visible="true">
<layer name="content_01" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="0" width="675" height="95" zorder="10007" children="false" html="data:test_text" css="data:test_css" autoheight="false" vcenter="false" background="true" backgroundcolor="0x000000" backgroundalpha=".5" border="false" bordercolor="0x000000" borderalpha="1.0" borderwidth="1.0" roundedge="0" shadow="0.0" shadowrange="4.0" shadowangle="45" shadowcolor="0x000000" shadowalpha="1.0" textshadow="0.0" textshadowrange="4.0" textshadowangle="45" textshadowcolor="0x000000" textshadowalpha="1.0" />
<layer name="close_01" url="%CURRENTXML%/skin/default_black/skin.png" align="righttop" x="0" y="0" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_01].alpha,1)" onout="tween(layer[close_01].alpha,.5)" onclick="tween(layer[content_layer_01].y,-95,);tween(layer[text_01].x,0,1,default, wait);tween(layer[text_01].alpha,1,.5,default, wait);" />
</layer>
</layer>
<layer name="img_layer_02" keep="true" type="container" align="center" x="695" y="0" width="675" height="346" zorder="10000" bgcolor="0xFFFFFF" bgalpha="0">
<layer name="image_02" url="%CURRENTXML%/images/exterior1.png" align="left" x="0" zorder="10003" onclick=""/>
<layer name="previous_02" url="%CURRENTXML%/images/previous.png" align="center" x="-310" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[previous_02].alpha,1)" onout="tween(layer[previous_02].alpha,.5)" onclick="tween(layer[img_layer_01].x, 0);tween(layer[img_layer_02].x, 695);" /> <layer name="next_02" url="%CURRENTXML%/images/next.png" parent="image_02" align="center" x="310" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[next_02].alpha,1)" onout="tween(layer[next_02].alpha,.5)" onclick="tween(layer[img_layer_02].x, -675);tween(layer[img_layer_03].x, 0)" />
<layer name="text_02" url="%CURRENTXML%/images/learnmore.png" align="leftbottom" x="0" y="30" width="100" height="50" zorder="10004" alpha=".5" onover="tween(layer[text_02].alpha,1)" onout="tween(layer[text_02].alpha,.5)" onclick="tween(layer[text_02].alpha,0,.3);tween(layer[text_02].x,-200,.5); tween(layer[content_layer_02].y,0)"/>
<!--********** Container Holding Content **********-->
<layer name="content_layer_02" keep="true" type="container" parent="image_02" align="leftbottom" x="0" y="-95" width="675" height="95" zorder="10004" bgcolor="0x000000" bgalpha=".5" visible="true">
<layer name="content_02" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="0" width="675" height="95" zorder="10004" children="false" html="data:test_text" css="data:test_css" autoheight="false" vcenter="false" background="false" backgroundcolor="0xFFFFFF" backgroundalpha="1.0" border="false" bordercolor="0x000000" borderalpha="1.0" borderwidth="1.0" roundedge="0" shadow="0.0" shadowrange="4.0" shadowangle="45" shadowcolor="0x000000" shadowalpha="1.0" textshadow="0.0" textshadowrange="4.0" textshadowangle="45" textshadowcolor="0x000000" textshadowalpha="1.0" />
<layer name="close_02" url="%CURRENTXML%/skin/default_black/skin.png" align="righttop" x="0" y="0" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_02].alpha,1)" onout="tween(layer[close_02].alpha,.5)" onclick="tween(layer[content_layer_02].y,-95);tween(layer[text_02].x,0,1,default,wait);tween(layer[text_02].alpha,1,.5,default, wait);" />
</layer>
</layer>
<layer name="img_layer_03" keep="true" type="container" align="center" x="695" y="0" width="675" height="346" zorder="10000" bgcolor="0xFFFFFF" bgalpha="0">
<layer name="image_03" url="%CURRENTXML%/images/exterior1.png" align="left" x="0" zorder="10001" onclick=""/>
<layer name="previous_03" url="%CURRENTXML%/images/previous.png" align="right" x="625" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[previous_03].alpha,1)" onout="tween(layer[previous_03].alpha,.5)" onclick="tween(layer[img_layer_02].x, 0);tween(layer[img_layer_03].x, 695)" />
<layer name="text_03" url="%CURRENTXML%/images/learnmore.png" align="leftbottom" x="0" y="30" width="100" height="50" zorder="10002" alpha=".5" onover="tween(layer[text_03].alpha,1)" onout="tween(layer[text_03].alpha,.5)" onclick="tween(layer[text_03].alpha,0,.3);tween(layer[text_03].x,-200,.5); tween(layer[content_layer_03].y,0)"/>
<!--********** Container Holding Content **********-->
<layer name="content_layer_03" keep="true" type="container" parent="image_03" align="leftbottom" x="0" y="-95" width="675" height="95" zorder="10002" bgcolor="0x000000" bgalpha=".5" visible="true">
<layer name="content_03" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="0" width="675" height="95" zorder="10002" children="false" html="data:test_text" css="data:test_css" autoheight="false" vcenter="false" background="false" backgroundcolor="0xFFFFFF" backgroundalpha="1.0" border="false" bordercolor="0x000000" borderalpha="1.0" borderwidth="1.0" roundedge="0" shadow="0.0" shadowrange="4.0" shadowangle="45" shadowcolor="0x000000" shadowalpha="1.0" textshadow="0.0" textshadowrange="4.0" textshadowangle="45" textshadowcolor="0x000000" textshadowalpha="1.0" />
<layer name="close_03" url="%CURRENTXML%/skin/default_black/skin.png" align="righttop" x="0" y="0" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_03].alpha,1)" onout="tween(layer[close_03].alpha,.5)" onclick="tween(layer[content_layer_03].y,-95);tween(layer[text_03].x,0,1,default,wait);tween(layer[text_03].alpha,1,.5,default,wait);" />
</layer>
</layer>
</layer>
</layer>
</layer>
<data name="test_text">
<p style="color:#ffffff; font-family:Times; font-size:14px; padding:0px; margin:0px; margin-bottom:10px; text-align:left; text-shadow: #000000 0px 1px 0px">
<b>Image_Title</b>
</p>
<br/>
<p style="color:#ffffff; font-family:Times; font-size:12px; padding:0px; margin:0px; margin-bottom:10px; text-align:left; text-shadow: #000000 0px 1px 0px">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin at magna odio. Aenean euismod ipsum convallis libero posuere vel mattis nisi posuere. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam adipiscing semper lobortis. Aliquam porttitor convallis posuere. Mauris pretium erat sem, non posuere urna. Fusce pretium, lorem eget sodales ullamcorper, mi ligula porttitor augue, vel suscipit mauris enim in urna. Nam quis neque justo. Vivamus sed nibh sem. Nunc in risus nec erat consequat aliquet. </p>
</data>
<data name="test_css">
p {color:#ffffff; font-family:Times;}
a {color:#ffffff}
</data>
Display More
Hello Everyone,
I've been building a content slider using the scrollarea plugin. Although I have come up with something which you can see here http://www.eyecandyvi.com/scroll/block.html I am experiencing one very strange issue and hopefully one solvable problem. aside from all the programming logic that could clean up the action I think I'm 90% there.
1.) I do my development on an iMac and when I test on a PC things don't work the same. For example if you click on the learn more button on a PC the close x and even the container holding the text content are not aligned. If I change it on the PC then it isn't aligned properly on the mac. Both using Firefox.
2.) more than two slides on the content slider creates an obvious problem. when you swipe on the image, it slides to the left and overshoots the center. I've been able to set it up with arrows but would like it to stop with the swipe action. I've tried to understand the examples presented in this thread but I may be missing something obvious. If this is not possible then is there a way to prevent the swipe action?
I've also reviewed the scrollbox example included in Klaus' package. I encounter the same problems I'm experiencing in number 1.
Hopefully someone can help.
Thanks,
Robert
<krpano version="1.0.8.15" title="" onstart="">
<include url="skin/vtourskin.xml" />
<include url="skin/default_black/core.xml" />
<!-- use a grid preview pano as background -->
<preview type="grid(cube,16,16,512,0xCCCCCC,0xF6F6F6,0x999999);" details="16" />
<hotspot name="info_01"
ath="0.0" atv="0.0"
zorder="10000"
scale=".75"
style="_hotspot_ani"
icon_type="info"
onclick="action(open_st);set(layer[frame].visible,true);tween(layer[frame].alpha,1,2);"
/>
<!--********** Container Holding ScrollArea, Images and Buttons **********-->
<layer name="frame" url="%CURRENTXML%/skin/win_bg.png" align="center" x="0" y="-15" width="699" height="370" zorder="10001" visible="false" alpha="0">
<layer name="frame_close_01" url="%CURRENTXML%/skin/skin.png" align="righttop" x="-14" y="-13" zorder="10001" crop="466|0|34|30" onclick="tween(layer[frame].alpha,0,.3,default,wait);action(close_st);set(layer[frame].visible,false);" />
<layer name="container" keep="true" type="container" align="center" y="0" width="675" height="346" zorder="10000" bgcolor="0xFFFFFF" bgalpha="0">
<layer name="scrollarea" url="%SWFPATH%/plugins/scrollarea.swf" alturl="%SWFPATH%/plugins/scrollarea.js" align="center" width="2065" height="359" direction="h" onloaded="setcenter(0,0);">
<layer name="image_01" url="%CURRENTXML%/images/exterior1.png" align="left" x="0" zorder="10006" onclick=""/>
<layer name="next_01" url="%CURRENTXML%/images/next.png" align="left" x="630" visible="true" alpha=".5" zorder="10007" scale=".75" onover="tween(layer[next_01].alpha,1)" onout="tween(layer[next_01].alpha,.5)" onclick="tween(layer[scrollarea].x, 0, distance(200,0.3));" />
<layer name="text_01" url="%CURRENTXML%/images/learnmore.png" align="leftbottom" x="0" y="30" width="100" height="50" zorder="10007" alpha=".5" onover="tween(layer[text_01].alpha,1)" onout="tween(layer[text_01].alpha,.5)" onclick="tween(layer[text_01].alpha,0,.3);tween(layer[text_01].x,-200,.5); tween(layer[cc_01].y,-3)" />
<!--********** Container Holding Content **********-->
<layer name="cc_01" keep="true" type="container" align="leftbottom" x="0" y="-120" width="675" height="50" zorder="10007" bgcolor="0x000000" visible="true">
<layer name="content_01" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="10" width="675" height="50" backgroundcolor="0x000000" backgroundalpha=".5" html="data:test_text" css="data:test_css" selectable="true" background="true" enabled="true"
handcursor="true" autosize="center" fixlimits="true" zorder="10007" onclick="" />
<layer name="close_01" url="%CURRENTXML%/skin/skin.png" align="righttop" x="0" y="-55" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_01].alpha,1)" onout="tween(layer[close_01].alpha,.5)" onclick="tween(layer[cc_01].y,-120,);tween(layer[text_01].x,0,1,default, wait);tween(layer[text_01].alpha,1,.5,default, wait);" />
</layer>
<layer name="image_02" url="%CURRENTXML%/images/exterior1.png" align="left" x="695" zorder="10003" onclick=""/>
<layer name="previous_02" url="%CURRENTXML%/images/previous.png" align="center" x="-310" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[previous_02].alpha,1)" onout="tween(layer[previous_02].alpha,.5)" onclick="tween(layer[scrollarea].x, 695, distance(200,0.3));" /> <layer name="next_02" url="%CURRENTXML%/images/next.png" align="center" x="310" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[next_02].alpha,1)" onout="tween(layer[next_02].alpha,.5)" onclick="tween(layer[scrollarea].x, -695, distance(200,0.3));" />
<layer name="text_02" url="%CURRENTXML%/images/learnmore.png" align="leftbottom" x="695" y="30" width="100" height="50" zorder="10004" alpha=".5" onover="tween(layer[text_02].alpha,1)" onout="tween(layer[text_02].alpha,.5)" onclick="tween(layer[text_02].alpha,0,.3);tween(layer[text_02].x,495,.5); tween(layer[cc_02].y,-3)"/>
<!--********** Container Holding Content **********-->
<layer name="cc_02" keep="true" type="container" align="leftbottom" x="695" y="-120" width="675" height="50" zorder="10004" bgcolor="0x000000" visible="true">
<layer name="content_02" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="10" width="675" height="50" backgroundcolor="0x000000" backgroundalpha=".5" html="data:test_text" css="data:test_css" selectable="true" background="true" enabled="true"
handcursor="true" autosize="center" fixlimits="true" zorder="10004" onclick="" />
<layer name="close_02" url="%CURRENTXML%/skin/skin.png" align="righttop" x="0" y="-55" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_02].alpha,1)" onout="tween(layer[close_02].alpha,.5)" onclick="tween(layer[cc_02].y,-120);tween(layer[text_02].x,695,1,default,wait);tween(layer[text_02].alpha,1,.5,default, wait);" />
</layer>
<layer name="image_03" url="%CURRENTXML%/images/exterior1.png" align="left" x="1390" zorder="10001" onclick=""/>
<layer name="previous_03" url="%CURRENTXML%/images/previous.png" align="right" x="625" visible="true" alpha=".5" zorder="10004" scale=".75" onover="tween(layer[previous_03].alpha,1)" onout="tween(layer[previous_03].alpha,.5)" onclick="tween(layer[scrollarea].x, 0, distance(200,0.3));" />
<layer name="text_03" url="%CURRENTXML%/images/learnmore.png" align="leftbottom" x="1390" y="30" width="100" height="50" zorder="10002" alpha=".5" onover="tween(layer[text_03].alpha,1)" onout="tween(layer[text_03].alpha,.5)" onclick="tween(layer[text_03].alpha,0,.3);tween(layer[text_03].x,1190,.5); tween(layer[cc_03].y,-3)"/>
<!--********** Container Holding Content **********-->
<layer name="cc_03" keep="true" type="container" align="leftbottom" x="1390" y="-120" width="675" height="50" zorder="10002" bgcolor="0x000000" visible="true">
<layer name="content_03" url="%CURRENTXML%/plugins/textfield.swf" align="leftbottom" x="0" y="10" width="675" height="50" backgroundcolor="0x000000" backgroundalpha=".5" html="data:test_text" css="data:test_css" selectable="true" background="true" enabled="true"
handcursor="true" autosize="center" fixlimits="true" zorder="10002" onclick="" />
<layer name="close_03" url="%CURRENTXML%/skin/skin.png" align="righttop" x="0" y="-55" crop="466|0|34|30" visible="true" alpha=".8" zorder="10008" scale=".75" onover="tween(layer[close_03].alpha,1)" onout="tween(layer[close_03].alpha,.5)" onclick="tween(layer[cc_03].y,-120);tween(layer[text_03].x,1390,1,default,wait);tween(layer[text_03].alpha,1,.5,default,wait);" />
</layer>
</layer>
</layer>
</layer>
<data name="test_text">
<p style="color:#ffffff; font-family:Times; font-size:14px; line-height:16px; padding:0px; margin:0px; margin-bottom:10px; text-align:left; text-shadow: #000000 0px 1px 0px">
<b>Image_Title</b>
</p>
<p style="color:#ffffff; font-family:Times; font-size:12px; line-height:16px; padding:0px; margin:0px; margin-bottom:10px; text-align:left; text-shadow: #000000 0px 1px 0px">
</p>
<p style="color:#ffffff; font-family:Times; font-size:12px; line-height:16px; padding:0px; margin:0px; margin-bottom:10px; text-align:left; text-shadow: #000000 0px 1px 0px">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin at magna odio. Aenean euismod ipsum convallis libero posuere vel mattis nisi posuere. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam adipiscing semper lobortis. Aliquam porttitor convallis posuere. Mauris pretium erat sem, non posuere urna. Fusce pretium, lorem eget sodales ullamcorper, mi ligula porttitor augue, vel suscipit mauris enim in urna. Nam quis neque justo. Vivamus sed nibh sem. Nunc in risus nec erat consequat aliquet. Sed sed quam enim, in sollicitudin leo. Aliquam vulputate iaculis neque sollicitudin aliquet. Nunc nibh odio, dapibus vitae suscipit sed, adipiscing iaculis mi. Aenean adipiscing mattis porttitor. Praesent ultricies mattis auctor. Maecenas non felis eu leo placerat dapibus id id libero.
</p>
</data>
<data name="test_css">
p {color:#ffffff; font-family:Times;}
a {color:#ffffff}
</data>
<!--<Screen Tint - Plugin>-->
<plugin name="screen_tint"
url="images/screen_tint.png"
keep="false"
align="center"
width="100%"
height="100%"
visible="false" enabled="false"
zorder="10000"
alpha="0" blendmode="multiply" smoothing="true"
refreshrate="auto"
/>
<!--<Set Open/Close Hotspot Actions Here.>-->
<action name="close_st">
tween(plugin[screen_tint].alpha,0,0.5,default);
set(plugin[screen_tint].visible, false);
</action>
<action name="open_st">
set(plugin[screen_tint].visible, true);
tween(plugin[screen_tint].alpha,.9,0.5,default);
</action>
<style name="_hotspot_ani"
url="images/hotspot.png"
crop=""
crop_normal=""
crop_hover=""
crop_down=""
timer="0"
delay="0"
toscene_action="
set(view.fovmin,30); tween(alpha,0,,easeOutQuad);
stoptween(scale); tween(scale,0.1,,easeOutQuad,get(hlookat),get(vlookat),get(fov)););
looktohotspot(get(name));
"
showimage_action="
tween(alpha,0,0.2,easeOutQuad);
stoptween(scale); tween(scale,0.1,0.2,easeOutQuad,
_image_flyout(_image,show,get(image_url));
tween(scale,1,1,easeOutQuad);animation(););
tween(view.hlookat,get(ath)); tween(view.vlookat,get(atv));
"
onloaded="
animation();
if(icon_type == 'arrow', set(crop,0|0|54|54);set(crop_normal,0|0|54|54);set(crop_hover,0|54|54|54);set(crop_down,0|108|54|54);set(delay,1));
if(icon_type == 'camera', set(crop,54|0|54|54);set(crop_normal,54|0|54|54);set(crop_hover,54|54|54|54);set(crop_down,54|108|54|54);set(delay,1.3));
if(icon_type == 'info', set(crop,108|0|54|54);set(crop_normal,108|0|54|54);set(crop_hover,108|54|54|54);set(crop_down,108|108|54|54);set(delay,1.15));
if(icon_type == 'video', set(crop,162|0|54|54);set(crop_normal,162|0|54|54);set(crop_hover,162|54|54|54);set(crop_down,162|108|54|54);set(delay,1.2));
if(toscene !== null, if(toscene != '', txtadd(hotspot[get(name)].onclick,toscene_action(););););
if(image_url !== null, if(image_url != '', txtadd(hotspot[get(name)].onclick,showimage_action(););););
txtadd(hotspot[get(name)].onover,copy(crop,crop_hover););
txtadd(hotspot[get(name)].onout,copy(crop,crop_normal););
txtadd(hotspot[get(name)].ondown,copy(crop,crop_down););
txtadd(hotspot[get(name)].onup,copy(crop,crop_normal););
resetsize();
"
animation="tween(timer,1,get(delay),easeOutQuad,tween(alpha,0.6,0.4,easeOutQuad, set(timer,0);tween(alpha,1,0.3,easeOutQuad);animation();););"
/>
</krpano>
Display More