Seite 1 von 1

Bannergröße je nach Destopauflösung

Verfasst: 06.09.2009 13:20
von Christian Spitzhüttl
Hi!

Ich habe ein kleines Board, das von verschiedenen User mit verschiedenen Desktopauflösungen
besucht wird. Jetzt habe ich aber einen Banner, der an die Auflösung von 1024Pixel Breite
angepasst ist. Zu dem nicht genug, auch noch an den Walnut-Style für den Firefox. Somit habe
ich dann eine Bannerbreite von 1009Pixel. Wenn jetzt aber eine User kommt und der nur
eine Auflösung von 800Pixel Breite hat, muss dieser Hin und Her scrollen.

Gibt es eine Möglichkeit, wie ich den Banner je nach Desktopauflöung, in passender
Größe laden kann?

Ich würde dazu mehrere Ordner auf dem Server anlegen, 800Pixel, 1024Pixel, ..., in denen
alles 11Banner sind, die mein Board verwendet. (Bei jedem Laden ein anderer Banner)

Ich hoffe, ihr könnt mir dabei vielleicht helfen!

Vielen Dank!
Christian

PS. Sollte das Thema falsch "gelagert" sein, bitte verschieben!

Re: Bannergröße je nach Destopauflösung

Verfasst: 06.09.2009 19:45
von Christian Spitzhüttl
Hi!

Könnte dies funktionieren?

Code: Alles auswählen

<script type="text/javascript">
if (screen.width == 800) {
document.write.on.line.137('<table width="100%" height="160" background="{T_IMAGESET_PATH}/800/site-logo-{SITE_LOGO_RANDOM}.jpg" alt="Logo" title="Logo" />');
alert("Banner für 800Pixel breite wird geladen.");
}
else if (screen.width == 1024) {
document.write.on.line.137('<table width="100%" height="160" background="{T_IMAGESET_PATH}/1024/site-logo-{SITE_LOGO_RANDOM}.jpg" alt="Logo" title="Logo" />');
alert("Banner für 1024Pixel breite wird geladen.");
}
else if (screen.width == 1280) {
document.write.on.line.137('<table width="100%" height="160" background="{T_IMAGESET_PATH}/1280/site-logo-{SITE_LOGO_RANDOM}.jpg" alt="Logo" title="Logo" />');
alert("Banner für 1280Pixel breite wird geladen.");
}
</script>
Christian

Re: Bannergröße je nach Destopauflösung

Verfasst: 06.09.2009 21:28
von Dufftown
Moin,

kann Dir leider nicht sagen ob das funktioniert, aber aufgefallen ist mir folgendes: screen.width nützt Dir ja nur was wenn der User seinen Browser im Vollbildmodus laufen lässt, bzw. das bringt ja dann auch nur die Bildschirmauflösung. Abgesehen von den normalen Rändern kann man ja auch da noch die Favoritenliste oder History an der Seite eingeblendet.

Würde daher versuchen den verfügbaren Anzeigebereich im Browser zu ermitteln, mittels window.innerWidth.

Re: Bannergröße je nach Destopauflösung

Verfasst: 07.09.2009 00:58
von John Doe
offset.width sollte auch funktionieren.

http://de.selfhtml.org/javascript/objek ... fset_width

Re: Bannergröße je nach Destopauflösung

Verfasst: 07.09.2009 20:57
von Boecki91
Und bitte <= statt == benutzen ;)

Re: Bannergröße je nach Destopauflösung

Verfasst: 12.09.2009 16:34
von Christian Spitzhüttl
Hi!

Danke für die Hilfe, jedoch habe wir, die Betreiber, uns jetzt eine andere Idee
einfallen lassen. Da wir jetzt wissen, das unsere Mitglieder alle mit mindestens
1024x768Pixel im Forum sind, möchten wir das Board wie folgt umbauen:
http://www.bahnkutscher.de/Forum-Vorschlag_gross.jpg
http://www.bahnkutscher.de/Forum-Vorschlag_klein.jpg
Große Bilder bitte nur verlinken - KB:16 - Dr.Death

Jetzt ist nur die Frage, was muss dort geändert werden, damit dies Funktioniert?

Danke,
Christian

Re: Bannergröße je nach Destopauflösung

Verfasst: 12.09.2009 22:00
von Christian Spitzhüttl
Hi!

Board ist erfolgreich umgebaut. Entweder kann das Thema gelöscht werden, oder...
Am besten entscheiden hier die Admins!

Re: Bannergröße je nach Destopauflösung

Verfasst: 13.09.2009 15:53
von Christian Spitzhüttl
Ist dann doch noch gut, das das Thema existiert... Habe jetzt noch das Problem,
das der IE den Schatten (Hintergrundbild einer Tabelle) am Foren-Rand nicht die
100% hoch macht, wie er es soll. Der Firefox hingegen macht das so wie erwünscht...

Hat jemand ne Idee?

overall_header

Code: Alles auswählen

<table cellpadding="0" cellspacing="0" width="100%" height="100%">
    <tr>
        <td background="background1.gif" align="right">
                <table style="line-height:100%; margin-top:0; margin-bottom:0;" cellpadding="0" cellspacing="0" width="10" height="100%" background="deko_links.png">
                    <tr height="100%">
                        <td>
                            <p style="line-height:100%; margin-top:0; margin-bottom:0;"><font face="Verdana" size="2">&nbsp;</font></p>
                        </td>
                    </tr>
                </table>
        </td>
        <td width="990px"><table width="100%" height="160" background="{T_IMAGESET_PATH}/site-logo-{SITE_LOGO_RANDOM}.jpg" alt="Logo" title="Logo" />
	<tr>
		<td width="100%"><p style="line-height:100%; margin-top:0; margin-bottom:0;" align="center"><font color="black">&nbsp;</font></p>
		</td>
	</tr>
	</table>
overall_footer

Code: Alles auswählen

        <td background="background1.gif">
            <table style="line-height:100%; margin-top:0; margin-bottom:0;" cellpadding="0" cellspacing="0" width="10px" height="100%" background="deko_rechts.png">
                <tr height="100%">
                    <td>
                        <p style="line-height:100%; margin-top:0; margin-bottom:0;"><font face="Verdana" size="2">&nbsp;</font></p>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
Danke,
Christian