Направил съм като минеш с мишката над някоя сграда да се отваря нещо като ново прозорче , в което ще изписва колко ресурси ще зима за следващия левел , но проблема е че дори и да не си върху тази сграда той пак се отваря и като се отвори това прозорче премества др. зграда на ляво. Ето цсс кода с който съм направил това

#foodmine {
        position: relative;
        width: 100px;
        height: 97px;
        background-image:url(../imgs/foodmine.png);
        background-repeat: no-repeat;
        left: 50%;
        margin-left: 140px;
}       

#foodmine:hover {
        position: relative;
        width: 225px;
        height: 200px;
        background-color: #7C5B37;
        border: 1px solid #CB942C;
        border-radius: 12px;
        -moz-border-radius: 12px;
        -moz-border-radius-topright: 12px;
        -webkit-border-top-right-radius: 12px;
        -webkit-border-top-left-radius: 12px;
        opacity: 0.8;
        -moz-opacity: 0.8;
        filter: alpha(opacity=80);      
}

Всъщност доколкото виждам от CSS-а картинката ще бъде с малко по-големи размери и с добавена рамка около нея. Преместването е нормално, тъй като всичките ти картинки предполагам са "position: relative", която се определя според другите елементи в кода. Относно проблема ти с мишката...не виждам защо възниква.

Да всички са "position: relative" , как да ги променя за де не се преместват?

Ако минеш на "absolute" (нямам добър спомен) мисля, че трябваше да им зададеш координати, което означава, че ще трябва предварително да им сметнеш координатите за да ги впишеш на ръка за всеки елемент.

Псевдоселекторът #foodmine:hover е дъщерен елемент на родителя #foodmine и това е вероятна причина за гафа, произтичаща от position: relative; Всъщност от един гол css koд мога само да завиждам на телепатчините ви способности, които при мен не са така силно развити.

Редактирано 9 април 201115 г. от Profruit (преглед на промените)

Вкарах този пхп код в джава скрипт

<img src="imgs/foodmine.png" onmouseover="<?php 
$selectMineLevel80 = mysql_query("SELECT * FROM users WHERE username='$username'");
$row80 = mysql_fetch_array($selectMineLevel80);
$yourfoodminelevel = $row80['foodmine_level'] +1;
$usergold = $row80['gold_have'];
$useriron = $row80['iron_have'];
$userwood = $row80['wood_have'];
$userfood = $row80['food_have'];
$select_level = mysql_query("SELECT * FROM buildings WHERE b_name='foodmine' AND level='$yourfoodminelevel'");
$minerow = mysql_fetch_array($select_level);
$gold = $minerow['gold_give'];
$iron = $minerow['iron_give'];
$wood = $minerow['wood_give'];
$food = $minerow['food_give'];
echo "<b><center>Ферми Ниво $yourfoodminelevel</center></b>";
echo "$gold - Злато<br><br> $iron - Желязо<br><br> $wood - Дърва<br><br> $food - Храна<br><br>";
if ($usergold < $gold || $useriron < $iron || $userwood < $wood || $userfood < $food) {
	echo "Недостатачно ресурси за да се построите тази сграда!";
}
	else
	echo "<font color='#004000'>Може да построите тази сграда</font>"; 
	?>" /></div>

но когато мишката е от горе на тази картинка нищо не става :s.

Редактирано 14 април 201115 г. от valkosoft (преглед на промените)

PHP скрипт се изпълнява на сървъра. Това означава, че в момента, в който страницата се е заредила PHP скриптът се е изпълнил. Не можеш със JS event да активираш PHP скрипт. Прегледай си изходния код на страницата през браузъра и виж въпросния PHP код какъв резултат генерира

Редактирано 13 април 201115 г. от darkyto (преглед на промените)

Вкарах този пхп код в джава скрипт

<img src="imgs/foodmine.png" onmouseover="<?php 
$selectMineLevel80 = mysql_query("SELECT * FROM users WHERE username='$username'");
$row80 = mysql_fetch_array($selectMineLevel80);
$yourfoodminelevel = $row80['foodmine_level'] +1;
$usergold = $row80['gold_have'];
$useriron = $row80['iron_have'];
$userwood = $row80['wood_have'];
$userfood = $row80['food_have'];
$select_level = mysql_query("SELECT * FROM buildings WHERE b_name='foodmine' AND level='$yourfoodminelevel'");
$minerow = mysql_fetch_array($select_level);
$gold = $minerow['gold_give'];
$iron = $minerow['iron_give'];
$wood = $minerow['wood_give'];
$food = $minerow['food_give'];
echo "<b><center>Ферми Ниво $yourfoodminelevel</center></b>";
echo "$gold - Злато<br><br> $iron - Желязо<br><br> $wood - Дърва<br><br> $food - Храна<br><br>";
if ($usergold < $gold || $useriron < $iron || $userwood < $wood || $userfood < $food) {
	echo "Недостатачно ресурси за да се построите тази зграда!";
}
	else
	echo "<font color='#004000'>Може да построите тази зграда</font>"; 
	?>" /></div>

но когато мишката е от горе на тази картинка нищо не става :s.

Използвай mysql_fetch_assoc вместо mysql_fetch_array, защото ти грабваш асоцияцията(нищо, че и така работи). И "зграда" се пише със "С"

PHP скрипт се изпълнява на сървъра. Това означава, че в момента, в който страницата се е заредила PHP скриптът се е изпълнил. Не можеш със JS event да активираш PHP скрипт. Прегледай си изходния код на страницата през браузъра и виж въпросния PHP код какъв резултат генерира

Ето какво връща:

<div id="foodmine"><img src="imgs/foodmine.png" onmouseover="<b><center>Ферми Ниво 11</center></b>698 - Злато<br><br> 635 - Желязо<br><br> 444 - Дърва<br><br> 889 - Храна<br><br>Недостатачно ресурси за да се построите тази сграда!" /></div>

Не ти ли прави впечатление, че няма нито един символ PHP код?

Най-лесно с JS и по-точно с AJAX за onmouseover или пък без него, а с ID и попъпа в JS-a.

С джаваскрипт ще трябва да пълни джаваскрипт масиви от пхп такъв, което е по-голяма играчка, останалото е сметки и после проверки в пхп при заявка.

Няма сайтове вече без JS. Особено ако се прави игра, то това е незаменима част от нея.

Има много сайтове, които използват AJAX, но тъй като избягвам въпросната библиотека (не знам дори дали мога така да го нарека скрипта), нямам никаква идея дали има JS в него или не.

Сайта е почти готов (80%) , но имам един въпрос как да направя (отнася се за картата) да се показва определена част от нея , тя е примерно 200х200 и искам да направя да се показва 50х50(с цсс ли е нещо), а и като цъкнеш на горе да се мести на горе и да показва др. част от картата и предишната да я скрива това се отнася за дясно,ляво и надолу?

Редактирано 24 април 201115 г. от valkosoft (преглед на промените)

Javascript и onclick събития на бутоните. Предварително си пълниш масив от базата в Javascript за да може при промяна на координатите Javascript да ти зареди съответните картинки върху картата, според информацията от базата (дали има играч на дадено поле или не).

Появи се голям проблем . При по малки или по голями монитори има разместване на елементи в сайта , има ли начин да го центрирам без да се разваля всичко щото ще стане за 3 път?

Просто си оправи CSS-а. Най-добре да фиксираш големината на сайта според най-ниската разделителна способност, която се използва. При по-големите ще остават празни ленти в страни от сайта, но ще ти реши проблема.

Появи се голям проблем ...

Слагаш глобален reset.css, а след него style.css с идея да постигнеш "гумен" сайт.

Пример, форума тук. Както и да го разпъваш, той заема 100% от body, без да гърми потока.

Просто си оправи CSS-а. Най-добре да фиксираш големината на сайта според най-ниската разделителна способност, която се използва. При по-големите ще остават празни ленти в страни от сайта, но ще ти реши проблема.

Не знам как да го направя това , може ли да ми покажеш как става ?

Слагаш глобален reset.css, а след него style.css с идея да постигнеш "гумен" сайт.

Пример, форума тук. Както и да го разпъваш, той заема 100% от body, без да гърми потока.

Сложиш този reset.css , но проблема си е същия :

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

Като основна (най-малка) разделителна способност можеш да вземеш 1024х768, тъй като май вече не останаха потребители, които да използват по-ниска. Фиксираш ширината в CSS-а на сайта да е по-малка от 1024 пиксела (все пак имаш рамка на браузъра - пример 1000рх) и оставяш височината на сайта да си се определя сама според съдържанието. Другия вариант е с общ <div> елемент да фиксираш крайните размери на сайта според прозореца: {width:100%;height:100%} и поставяш всички останали елементи в този <div>. По този начин той ще ти е рамката на цялото полезно съдържание. П.П. Примерни варианти според информацията, която си дал

Като основна (най-малка) разделителна способност можеш да вземеш 1024х768, тъй като май вече не останаха потребители, които да използват по-ниска. Фиксираш ширината в CSS-а на сайта да е по-малка от 1024 пиксела (все пак имаш рамка на браузъра - пример 1000рх) и оставяш височината на сайта да си се определя сама според съдържанието. Другия вариант е с общ <div> елемент да фиксираш крайните размери на сайта според прозореца: {width:100%;height:100%} и поставяш всички останали елементи в този <div>. По този начин той ще ти е рамката на цялото полезно съдържание.

П.П. Примерни варианти според информацията, която си дал

Кажи каква информация ти трябва и ще ти дам . Това с дива ми изглежда по-добре , но как да фиксирам размерите на сайта според width:100%;height:100% ?

Като зададеш размерите на 100% при всяка промяна на размерите на прозореца ще се променя и големината на сайта.

Ми добавих в цсс кода : width:100%;height:100% , но никва промяна .

Дай да видим как са ти структурирани елементите (без съдържанието) и цсс кода.