So, noch ein problem.
css und html mögen mich einfach nicht ...
Der Plan:
ein Fenter am linken Rand auf click anzeigen lassen.
Also - button am linken Rand. Wenn button "onclick" dann öffnet sich das Fenster(div) und der button soll am rechten Rand des Fensters sein.
Der code:
<!-- TS3 -->
<div id="TS3_button" style="position:fixed;left:0px;top:250px;opacity:0.5;cursor:pointer;" onmouseover="style.opacity='1'" onmouseout="style.opacity='0.5'" onclick="toggle_id_display('TS3_button');toggle_id_display('TS3_window');get_TS3_window_width();">
<?echo TS3_BUTTON;?>
</div>
<span id="TS3_window" style="position:fixed;left:0px;top:250px;display:none;border: solid 1px #9E9E9F;background:#3F4043;vertical-align: top;">
<span id="ts3viewer_999761">
<script type="text/javascript" src="http://static.tsviewer.com/short_expire/js/ts3viewer_loader.js"></script>
<script type="text/javascript">
<!--
var ts3v_url_1 = "http://www.tsviewer.com/ts3viewer.php?ID=999761&text=000000&text_size=12&text_family=1&js=1&text_s_weight=bold&text_s_style=normal&text_s_variant=normal&text_s_decoration=none&text_s_color_h=525284&text_s_weight_h=bold&text_s_style_h=normal&text_s_variant_h=normal&text_s_decoration_h=underline&text_i_weight=normal&text_i_style=normal&text_i_variant=normal&text_i_decoration=none&text_i_color_h=525284&text_i_weight_h=normal&text_i_style_h=normal&text_i_variant_h=normal&text_i_decoration_h=underline&text_c_weight=normal&text_c_style=normal&text_c_variant=normal&text_c_decoration=none&text_c_color_h=525284&text_c_weight_h=normal&text_c_style_h=normal&text_c_variant_h=normal&text_c_decoration_h=underline&text_u_weight=bold&text_u_style=normal&text_u_variant=normal&text_u_decoration=none&text_u_color_h=525284&text_u_weight_h=bold&text_u_style_h=normal&text_u_variant_h=normal&text_u_decoration_h=none";
ts3v_display.init(ts3v_url_1, 999761, 100);
-->
</script>
</span>
<span id="TS3_close_button" style="display:none;cursor:pointer;position:absolute;top:0;" onclick="toggle_id_display('TS3_button');toggle_id_display('TS3_window');"><?echo TS3_BUTTON;?></span>
</span>
<!--/ TS3 -->
Alles anzeigen
und das JS:
function get_TS3_window_width(){
setTimeout(function(){ document.getElementById("TS3_close_button").style.display='';
document.getElementById("TS3_close_button").style.left=ts3viewer_999761.offsetWidth;
alert(ts3viewer_999761.offsetWidth); }, 1000);
}
Der Ablauf ist recht einfach:
- onlcick auf button id="TS3_button" wird dieser versteckt,
- gleichzeitig span id="TS3_window" angezeigt,
- und eine JS function aufgerufen um die Breite des spans herauszubekommen.
Warum die breite: Das TS3 window hat dynamische breite/höhe. Ich hab gesehen, dass viele einfach eine feste Breite angeben, wodurch dann der Scrollbalken erwacht -.-
Testweise hab ich mir mit alert die Breite anzegen lassen und es funtioniert. Allerdings lässt sich wohl der Abstand "left" nicht per JS setzen ?
document.getElementById("TS3_close_button").style.left=ts3viewer_999761.offsetWidth;
^sollte doch eigtl das style von "left" auf 'ts3viewer_999761.offsetWidth' setzen (also die ermittelte Breite).
Aber es tuts nicht.
Hab ich da was übersehen?