background na cały ekran

zm1q · Mar 16, 2012

Witam mam backgrounda w rozdzielczośći 1600x800px. Próbowałem już chyba wszystkiego chce aby był on nieruchomy i rozciągniety na cały ekran. Siedze przy tym dobre kilkanaście minut i za hu** nie moge sobie poradzić.

Aktualnie mam w htmlu

PHP:

  <div id="ArtworkHelper" style="background-image:url(/<?PHP echo $layout_name; ?>/images/header/bg.jpg);" >
  <div style="width:1000px;" id="Bodycontainer">

a w css

PHP:

body {
  margin: 0px;
  padding:  0px;
background-color: #000000;
}

#ArtworkHelper {
  text-align: center;
  background-position: top center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  min-width: 1000px;
  min-height: 800px;
}

Jakieś pomysły?

elf · Mar 16, 2012

raczej brak, zwłaszcza, że nie jesteś w stanie powiedzieć nawet co Ci "nie działa".

Azi · Mar 16, 2012

zm1q said:
Witam mam backgrounda w rozdzielczośći 1600x800px. Próbowałem już chyba wszystkiego chce aby był on nieruchomy i rozciągniety na cały ekran. Siedze przy tym dobre kilkanaście minut i za hu** nie moge sobie poradzić.

a jaki windows masz?
wcale HTMLu nie musisz, żeby ustawić sobię background na ekran, wystraczy prawym na pulpit, ustawienia i zmień tapte. ;d

zm1q · Mar 16, 2012

elf said:
raczej brak, zwłaszcza, że nie jesteś w stanie powiedzieć nawet co Ci "nie działa".

po zjechaniu w dól scrollem objawia się teraz takie coś

mój php

PHP:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <link rel="stylesheet" type="text/css" href="<?PHP echo $layout_name; ?>/st.css">
  <title><?PHP echo $title; ?></title>
  <meta name="author" content="Inwob" />
  <meta http-equiv="content-language" content="pl" />
  <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
  <meta name="keywords" content="free online game,free multiplayer game,ots,open tibia server,narvia,zivera,tibia,otserv,rpg,orshabaal,war,ots tibia,ip changer,lista ots,forum ots" />
  <link rel="shortcut icon" href="<?PHP echo $layout_name; ?>/images/server.ico" type="image/x-icon">
  <link rel="icon" href="<?PHP echo $layout_name; ?>/images/server.ico" type="image/x-icon">
  <link href="<?PHP echo $layout_name; ?>/basic.css" rel="stylesheet" type="text/css">
  <script type="text/javascript" src="<?PHP echo $layout_name; ?>/initialize.js"></script>
  <script type="text/javascript" src="<?PHP echo $layout_name; ?>/menu.js"></script>
<script type="text/javascript" src="<?PHP echo $layout_name; ?>/scripts.js"></script>

  </head>
<body onBeforeUnLoad="SaveMenu();" onUnload="SaveMenu();" >
 <a name="top"></a>
  <div id="ArtworkHelper" style="background-image:url(/<?PHP echo $layout_name; ?>/images/header/bg.jpg);" >
  <div style="width:1000px;" id="Bodycontainer">
      <div id="ContentRow">
        <div id="MenuColumn">
        <dt><table width="170px" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>
    	<dl id="menu1"><dt><a href="javascript:void(0)"><img src="<?PHP echo $layout_name; ?>/images/news.jpg" /></a></dt>

            <dd><a href="?subtopic=latestnews">Latest News</a><dd>
			<dd><a href="?subtopic=archive">News Archive</a><dd>
			<dd><a href="?subtopic=serverinfo">Server Info</a></dd>
			
			<dt><a href="javascript:void(0)"><img src="<?PHP echo $layout_name; ?>/images/account.jpg" /></a></dt>
			
			<dd><a href="?subtopic=accountmanagement">Login</a></dd>
            <dd><a href="?subtopic=createaccount">Create Account</a></dd>
            <dd><a href="?subtopic=lostaccount">Lost Account?</a></dd>		
            <dd><a href="?subtopic=tibiarules">Server Rules</a></dd>	
			
            <dt><a href="javascript:void(0)"><img src="<?PHP echo $layout_name; ?>/images/community.jpg" /></a></dt>
			
            <dd><a href="?subtopic=characters">Search Player</a></dd>
            <dd><a href="?subtopic=highscores">Highscores</a></dd>
            <dd><a href="?subtopic=killstatistics">Last Deaths</a></dd>
            <dd><a href="?subtopic=bans">Banishments</a></dd>
			<dd><a href="?subtopic=topguilds">Top Guilds</a></dd>
			<dd><a href="?subtopic=wars">Wars Statistic</a></dd>
			<dd><a href="?subtopic=topfrags">Top Frager</a></dd>
            <dd><a href="?subtopic=guilds">Guilds</a></dd>
            <dd><a href="?subtopic=records">Player Records</a></dd>
            <dd><a href="?subtopic=houses">Houses</a></dd>
            <dd><a href="?subtopic=team">Game Masters</a></dd>

			<dt><a href="javascript:void(0)"><img src="<?PHP echo $layout_name; ?>/images/library.jpg" /></a></dt>
            <dd><a href="?subtopic=creatures">Monsters</a></dd>
			<dd><a href="?subtopic=spells">Spells</a></dd>
			<dd><a href="?subtopic=whoisonline">Who is online?</a></dd>
			<dd><a href="?subtopic=newquest">New Quest</a></dd>

			<dt><a href="javascript:void(0)"><img src="<?PHP echo $layout_name; ?>/images/forum.jpg" /></a></dt>
            
			<dd><a href="?subtopic=forum">Forum</a></dd>
		
			<dt><a href="javascript:void(0)"><img src="<?PHP echo $layout_name; ?>/images/shop.jpg" /></a></dt>
            <dd><a href="?subtopic=buypoints">Buy Points</a></dd>
            <dd><a href="?subtopic=shopsystem">Shop Offer</a></dd>
			<dd><a href="?subtopic=shopsystem&action=show_history">Shop History</a></dd>
            <dt><img style="background:none;" border="0" src="<?PHP echo $layout_name; ?>/images/down.png" /></dt></dl>

<script type="text/javascript">
// <![CDATA[
new Menu('menu1', '', false);
// ]]>
</script>

    </td>
  </tr>
</table><script type='text/javascript'>InitializePage();</script></div>
        <div id="ContentColumn">
          <div class="Content">
            <div id="ContentHelper">
			<div id="newsticker" class="Box">
    <div class="Corner-tl" style="background-image: url(<?PHP echo $layout_name; ?>/images/content/corner-tl.gif);"></div>
    <div class="Corner-tr" style="background-image: url(<?PHP echo $layout_name; ?>/images/content/corner-tr.gif);"></div>
    <div class="Border_1" style="background-image: url(<?PHP echo $layout_name; ?>/images/content/border-1.gif);"></div>
    <div class="BorderTitleText" style="background-image: url(<? echo $layout_name; ?>/images/content/title-background-green.gif);"></div>
    <div class="Border_2">
      <div class="Border_3">
        <div class="BoxContent" style="background-image: url(<?PHP echo $layout_name; ?>/images/content/scroll.gif);">
<table border="0" cellspacing="3" cellpadding="4" width="100%">
	<tr>
	
	<td style="width: 100%; text-align: center;">

			<div id="seconds"></div>
			<b>.:YOU::NEWS:.</b>
</div>
			
		</td>	</tr></table></div>
      </div>
    </div>
    <div class="Border_1" style="background-image: url(<?PHP echo $layout_name; ?>/images/content/border-1.gif);"></div>
    <div class="CornerWrapper-b"><div class="Corner-bl" style="background-image: url(<?PHP echo $layout_name; ?>/images/content/corner-bl.gif);"></div></div>
    <div class="CornerWrapper-b"><div class="Corner-br" style="background-image: url(<?PHP echo $layout_name; ?>/images/content/corner-br.gif);"></div></div>
  </div>    <div id="latestnews" class="Box">
    <div class="Corner-tl" style="background-image:url(<?PHP echo $layout_name; ?>/images/content/corner-tl.gif);"></div>
    <div class="Corner-tr" style="background-image:url(<?PHP echo $layout_name; ?>/images/content/corner-tr.gif);"></div>
    <div class="Border_1" style="background-image:url(<?PHP echo $layout_name; ?>/images/content/border-1.gif);"></div>
    <div class="BorderTitleText" style="background-image:url(<?PHP echo $layout_name; ?>/images/content/title-background-green.gif);"></div>
    <div class="Border_2">
      <div class="Border_3">
        <div class="BoxContent" style="background-image:url(<?PHP echo $layout_name; ?>/images/content/scroll.gif);">
  <?PHP echo $main_content; ?> 
      </div>
      </div>
    </div>
    <div class="Border_1" style="background-image:url(<?PHP echo $layout_name; ?>/images/content/border-1.gif);"></div>

    <div class="CornerWrapper-b"><div class="Corner-bl" style="background-image:url(<?PHP echo $layout_name; ?>/images/content/corner-bl.gif);"></div></div>
    <div class="CornerWrapper-b"><div class="Corner-br" style="background-image:url(<?PHP echo $layout_name; ?>/images/content/corner-br.gif);"></div></div>
  </div>
           </div>
          </div>
          <div id="Footer">
            You are not allowed to copy the content or design from this website. <br />
            Copyright &copy; 2012 <a href="">OTNAME.NET</a>. All rights reserved.</a>
          </div>
  </body>
</html>

Azi said:
a jaki windows masz?
wcale HTMLu nie musisz, żeby ustawić sobię background na ekran, wystraczy prawym i zmień tapte. ;d

wytłumacz no mi proszę szybko raz raz jak ustawić tapete na cały ekran w windows 8 bo ja nie wiedzieć

Azi · Mar 16, 2012

spróbuj tak

PHP:

body { 
 margin: auto auto;
} 
#content { 
	width:100%;
	height: 100%;
	position: fixed;
	background-image: url(bg.png);
	background-position: center;
}

i stronę dać w <div id=content>

zm1q · Mar 16, 2012

Azi said:
spróbuj tak

PHP:

body { margin: auto auto; } #content { width:100%; height: 100%; position: fixed; background-image: url(bg.png); background-position: center; }

i stronę dać w <div id=content>

teraz to już kompletnie sie wszystko rozwaliło tzn:

na górę str nie patrz bo coś mi sie nie chciał zainstalować acc i go zainstalowałem na siłe i teraz sypie błędami bo chciałem tylko ogarnąć laya

//edit:

Już sam sobie poradziłem jak by ktoś miał podobny problem to

PHP:

body {
  margin: 0;
  padding:  0;
background-color: #000000;
}

#ArtworkHelper {

  background-position: top center;
  background-attachment: fixed;
  background-repeat: no-repeat;

}  

/* container to implement min/max width */
#Bodycontainer {
  text-align: left;
  min-width: 1000px;
  max-width: 1000px;
  width: 100%;
  height: 120%;
  margin: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0px;
  display: table;
}

i w .php

PHP:

<div id="ArtworkHelper" style="background-image:url(/<?PHP echo $layout_name; ?>/images/header/bg.jpg);" >

testowane na IE9 i Google Chrome

Bufo · Mar 17, 2012

PHP:

#ArtworkHelper {
    width: 100%; 
    height: 100%;
    position: absolute; 
    left: 0px; 
    top: 0px; 
    z-index: 0;
	background-image: url(000.png);
	background-size: 100%;
	background-origin: content;
}

Powinno załapać

sn3ejk · Mar 17, 2012

Ogólnie głupi pomysł, bo przy większych rozdzielczościach będzie to do dupy wyglądać. Ja radzę wycentrować art, i zrobić aby przy progach wtapiał się w tło.

background na cały ekran

zm1q

New Member

elf

Sing, sing blue silver

Azi

Banned User

zm1q

New Member

Azi

Banned User

zm1q

New Member

Bufo

-.-'

sn3ejk

This account is inactive.