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
Code
<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>Scrollbox XML
Code
<!--********** 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>
