Different Textfield rendering in Flash / HTML5

  • We are using the textfield plug-in to display a text above a hotspot. We had to play with the height-settings (CSS style "height: 200px") of the textfield to accomplish this.

    However: running the Panorama in Flash ignores the height-attribute completely so the text is rendered exactly on the hotspot itself.

    Is there any way to make the text appear above or under the hotspot so it looks the same in Flash and in HTML5 (second picture)?

    We are using the following Textfield-declaration:

    Code
    <plugin name="hotspottext25" background="false" url="plugins/textfield.swf" parent="hotspot[spot1]" html="[p]Kochen[/p]" css="p{color:#FFFFFF; font-family:Verdana; font-size:16px; text-align: center; height: 200px; border: 0px;}" vcenter="true" roundedge="10" align="center" text-shadow="0.0" shadow="0.0" enabled="false" border="false" border-width="0.0" />
  • Hi,

    css height settings aren't supported by the Flashplayer:
    https://krpano.com/plugins/textfield/#css

    About you could (and should) set the height of the textfield plugin itself - the default height of the textfield plugin is 300px.

    e.g. add autoheight="true" and remove the vcenter="true", and then move the text by the y or oy plugin settings (like you already do now )

    best regards,
    Klaus

  • Well I tried to set autoheight to "true" but then it wasn't showing any text at all using HTML5 :( Wenn I set it to "false", it shows my text just fine on most devices but I realized the text is too small on phones (even if the phone has the same resolution) - i.e. on an iPad it is fine and at the right size, on an iPhone the arrow-icon has the the correct size but the text is too small to read, the same applies for android devices.

  • I'm using the following attributes which work fine on Flash, but not at all on HTML5 (no text is shown):

    My plug-in call looks like this:

    <plugin name="hotspottext27" background="false" url="plugins/textfield.swf" parent="hotspot[spot3]" html="[p]OG1_Kind[/p]" css="p{color:#FFFFFF; font-family:Verdana; font-size:18pt; font-weight: bold; text-align: center; border: 0px;}" vcenter="false" roundedge="10" align="center" text-shadow="0.0" shadow="0.0" enabled="false" border="false" border-width="0.0" x="0" y="-50" autoheight="true" />


    If I set "autoheight" to false, the text is shown but neither in the right size (much too small) nor the same position as it is shown on flash.

    I forgot to mention: if I set a height (i.e. to 100 (px?)) the position of the text is still about 20 pixel different in HTML5 and Flash.

    I guess I'll stick with "y = -40" and "height = 100" - that seems to be a good compromise.

    Einmal editiert, zuletzt von McTristan (22. November 2012 um 10:48)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!