hi !
(did you try gridfit=false or auto ? .. this option saved me in the past.)
gridfit="false"It could definitely help you make it smoother :)
but i'm not an expert
just tween width
Like this looks a bit smoother i think.
I make the text red and white again with the css animation.
<style name="htsp" type="text" width="50" height="50" edge="left" text="[b]+[/b]" textalign="center" cssclass="button" onover="doaniover(*name);" onout="doaniout(*name);" onloaded="ox = width/2 * -1" />
<cssstyles>
.button
{
color: white;
font-size: 14px;
font-weight: bold;
background: #ff0000;
border-radius: 25px;
}
.flash {
animation: flashRed 0.5s forwards;
}
@keyframes flashRed {
0% { color: white; }
40% { color: red; }
100% { color: white; }
}
</cssstyles>
<action autorun="preinit" type="js" >
<![CDATA[
krpano.doaniover = function(name){
let t = krpano.get("hotspot["+name+"]");
krpano.tween(t, {width:180}, 0.5, "smooth");
krpano.call("delayedcall(0.15, hotspot["+name+"].text = 'Read More');");
t.cssclass = "button flash";
krpano.call("delayedcall(0.3, hotspot["+name+"].cssclass = 'button');");
}
krpano.doaniout = function(name){
let t = krpano.get("hotspot["+name+"]");
krpano.tween(t, {width:50}, 0.5, "smooth");
krpano.call("delayedcall(0.15, hotspot["+name+"].text = '[b]+[/b]');");
t.cssclass = "button flash";
krpano.call("delayedcall(0.3, hotspot["+name+"].cssclass = 'button');");
}
]]>
</action>Tuur
Don’t have an account yet? Register yourself now and be a part of our community!
