|
Пишем свою браузерную игру
|
|
| Lord135 | Дата: Среда, 28 Марта 2012, 21:40 | Сообщение # 1 |
постоянный участник
Сейчас нет на сайте
| У Ассасина уроки замечательные бесспорно, но всё же я решил создать эту тему.
Уроки я буду писать постепенно, где-то по 2 в неделю или больше, как пойдёт.
Писать игру будем на php+JavaScript+MySQL
Программы которые будут использоваться в данном уроке: WYSIWYG 8, Notepad++, Filezilla
Для начала нам нужно выбрать хостинг
Для начала думаю подойдёт и radyx.ru
____________________________________
Ну собственно сам урок: (html+css) Главная страница, форма входа
Открываем WYSIWYG и располагаем изображение которые будут у вас на главной страницы так, как вам нужно. Далее вставляем два поля и кнопку.
В свойствах первого поля устанавливаем имя "user"
В свойствах второго поля устанавливаем имя "passw"
В свойствах кнопки устанавливаем имя "login_btt" и значение "Войти"
После этих действий выбираем папку в которую будет публиковаться html файлы и изображения. А, чуть не забыл, в свойствах страницы в WYSIWYG'е меняем расширение из html на php и переименовываем её в index
Всё, главная страница готова, точнее она готова внешне.
Теперь открываем файл index.php блокнотом (Notepad++)
Находим примерно такой код:
Code
<input type="submit" id="Button1" name="login_btt" value="Войти" style="position:absolute;left:445px;top:499px;width:96px;height:25px;z-index:6;">
<input type="text" id="Editbox1" style="position:absolute;left:409px;top:444px;width:167px;height:18px;line-height:18px;z-index:8;" name="login" value="Логин">
<input type="password" id="Editbox2" style="position:absolute;left:409px;top:471px;width:167px;height:18px;line-height:18px;z-index:9;" name="passw" value="Пароль">
Немного его изменяем:
Code
<input type="text" id="Editbox1" style="position:absolute;left:409px;top:444px;width:167px;height:18px;line-height:18px;z-index:8;" name="login" value="Логин">
на
Code
<input type="text" id="Editbox1" style="position:absolute;left:409px;top:444px;width:167px;height:18px;line-height:18px;z-index:8;" name="login" value="Логин" onBlur="if (value == '') {value='Логин'}" onFocus="if (value == 'Логин') {value =''}" maxlength="16">
И
Code <input type="password" id="Editbox2" style="position:absolute;left:409px;top:471px;width:167px;height:18px;line-height:18px;z-index:9;" name="passw" value="Пароль">
на
Code <input type="password" id="Editbox2" style="position:absolute;left:409px;top:471px;width:167px;height:18px;line-height:18px;z-index:9;" name="passw" onBlur="if (value == '') {value='Пароль'}" onFocus="if (value == 'Пароль') {value =''}" value="Пароль" maxlength="16">
в итоге получаем вот такой код:
Code <input type="submit" id="Button1" name="login_btt" value="Войти" style="position:absolute;left:445px;top:499px;width:96px;height:25px;z-index:6;">
<input type="text" id="Editbox1" style="position:absolute;left:409px;top:444px;width:167px;height:18px;line-height:18px;z-index:8;" name="login" onBlur="if (value == '') {value='Логин'}" onFocus="if (value == 'Логин') {value =''}" value="Логин" maxlength="16">
<input type="password" id="Editbox2" style="position:absolute;left:409px;top:471px;width:167px;height:18px;line-height:18px;z-index:9;" name="passw" onBlur="if (value == '') {value='Пароль'}" onFocus="if (value == 'Пароль') {value =''}" value="Пароль" maxlength="16">
Но это ещё не всё.
Теперь нужно эту кнопку и два поля вписать в форму, вот так:
<form action="enter.php" method="post">
Code <input type="submit" id="Button1" name="login_btt" value="Войти" style="position:absolute;left:445px;top:499px;width:96px;height:25px;z-index:6;">
<input type="text" id="Editbox1" style="position:absolute;left:409px;top:444px;width:167px;height:18px;line-height:18px;z-index:8;" name="login" onBlur="if (value == '') {value='Логин'}" onFocus="if (value == 'Логин') {value =''}" value="Логин" maxlength="16">
<input type="password" id="Editbox2" style="position:absolute;left:409px;top:471px;width:167px;height:18px;line-height:18px;z-index:9;" name="passw" onBlur="if (value == '') {value='Пароль'}" onFocus="if (value == 'Пароль') {value =''}" value="Пароль" maxlength="16">
</form>
А теперь разберёмся что значит maxlength , onBlur , onFocus , if , <form> и пр.
maxlength - устанавливает максимально допустимое количество символов в текстовом поле (к типу button не применяеться)
onBlur - определяет событие которое происходит если пользователь расфокусирован
onFocus - определяет событие которое происходит если пользователь сфокусирован на текстовом поле
if - если
<form action="enter.php" method="post"></form> - <form action=""> - action="" - указывает куда отправляются данные, в нашем случае это файл enter.php
method="" - указывает тип передачи данных, в нашем случае это post (есть ещё get)
Главная страница готова.
Теперь подключаемся через Filezilla к FTP-аккаунту и закачиваем файл и картинки на сервер.
В следующем уроке будем создавать таблицу users в базе данных и писать файл enter.php
Сообщение отредактировал Lord135 - Среда, 28 Марта 2012, 21:42 |
|
|
| |
| romgerman | Дата: Среда, 28 Марта 2012, 22:26 | Сообщение # 2 |
старожил
Сейчас нет на сайте
| Lord135, эм... а сам файл enter.php, как делать? Или это только урок дизайна? Добавлено (28.03.2012, 22:26)
---------------------------------------------
Quote (Lord135) Находим примерно такой код:
Я такой не нахожу *)
|
|
|
| |
| Lord135 | Дата: Четверг, 29 Марта 2012, 21:19 | Сообщение # 3 |
|
постоянный участник
Сейчас нет на сайте
| enter.php в следующем уроке покажу как делать)) А в этом только index.php - гл.страницу токо делаем) Завтра думаю выложу второй урок) Добавлено (28.03.2012, 22:30)
---------------------------------------------
Quote (romgerman) Я такой не нахожу *)
А такой есть:
Code
<input type="submit" id="Button1" value="Submit" style="position:absolute;left:445px;top:499px;width:96px;height:25px;z-index:6;">
<input type="text" id="Editbox1" style="position:absolute;left:409px;top:444px;width:167px;height:18px;line-height:18px;z-index:8;">
<input type="password" id="Editbox2" style="position:absolute;left:409px;top:471px;width:167px;height:18px;line-height:18px;z-index:9;">
?Добавлено (29.03.2012, 21:19)
---------------------------------------------
Второй урок здесь.
|
|
|
| |
| romgerman | Дата: Четверг, 29 Марта 2012, 22:39 | Сообщение # 4 |
|
старожил
Сейчас нет на сайте
| Нет *)
|
|
|
| |
| Lord135 | Дата: Четверг, 29 Марта 2012, 22:40 | Сообщение # 5 |
|
постоянный участник
Сейчас нет на сайте
| а какой есть?))
|
|
|
| |
| romgerman | Дата: Четверг, 29 Марта 2012, 23:43 | Сообщение # 6 |
|
старожил
Сейчас нет на сайте
| Quote (Lord135) а какой есть?))
Да не важно. Я просто намекнул на то, что не у всех стоит WYSIWYG 8, Notepad++. У меня, например, Dreamweaver.
|
|
|
| |
| ПрофЭссор | Дата: Пятница, 27 Апреля 2012, 20:14 | Сообщение # 7 |
Разработка и создание сайтов. Студия: dezFlyin.
Сейчас нет на сайте
| Смысл ставить ни к чему не нужную "не начатую" игру на хост? Лучше ставить на локалку, меньше гемороя, больше скорости.. Добавлено (27.04.2012, 20:14)
---------------------------------------------
Да, и в последующем, лучше писать инклудами. Защита так сказать. Не откладывай, на верстку, лучше делать сразу поверь. много гемороя с этим..
skype: dezFlyin
icq: 798983
e-mail: dezfl@yandex.ru
Если не знаете с чего начать, просто напишите...
Чтобы оставаться на месте, надо бежать, а чтобы куда-то попасть, надо бежать ещё быстрее.
Дешевая расскрутка сайтов!
|
|
|
| |
| Lord135 | Дата: Пятница, 27 Апреля 2012, 22:26 | Сообщение # 8 |
|
постоянный участник
Сейчас нет на сайте
| Quote (ПрофЭссор) Да, и в последующем, лучше писать инклудами.
зачем? зафиг что-либо инклудить, если нечего инклудить, php кода в index.php практически не будет, только функция логаута.
|
|
|
| |
| ПрофЭссор | Дата: Среда, 02 Мая 2012, 21:37 | Сообщение # 9 |
|
Разработка и создание сайтов. Студия: dezFlyin.
Сейчас нет на сайте
| Lord135, я имею в виду не только про сам индекс но и про гейм и т.д.
skype: dezFlyin
icq: 798983
e-mail: dezfl@yandex.ru
Если не знаете с чего начать, просто напишите...
Чтобы оставаться на месте, надо бежать, а чтобы куда-то попасть, надо бежать ещё быстрее.
Дешевая расскрутка сайтов!
Сообщение отредактировал ПрофЭссор - Среда, 02 Мая 2012, 21:39 |
|
|
| |
| Lord135 | Дата: Среда, 02 Мая 2012, 22:16 | Сообщение # 10 |
|
постоянный участник
Сейчас нет на сайте
| ну-ну
|
|
|
| |
| Yoda154 | Дата: Четверг, 03 Мая 2012, 19:01 | Сообщение # 11 |
участник
Сейчас нет на сайте
| Ты лучше игру сделай, а потом уже будешь уроки писать
|
|
|
| |
| Lord135 | Дата: Четверг, 03 Мая 2012, 21:02 | Сообщение # 12 |
|
постоянный участник
Сейчас нет на сайте
| делаю, я, делаю, "это только со стороны кажется, что я сплю" (с)
|
|
|
| |
| Yoda154 | Дата: Пятница, 04 Мая 2012, 14:46 | Сообщение # 13 |
|
участник
Сейчас нет на сайте
| Quote (Lord135) делаю, я, делаю, "это только со стороны кажется, что я сплю" (с)
Да что-то прогресс слишком медленно движется
|
|
|
| |
| Avtokrator | Дата: Четверг, 17 Мая 2012, 16:44 | Сообщение # 14 |
|
был не раз
Сейчас нет на сайте
| Главное, что "движется"! А не стоит на месте!!! 
|
|
|
| |
| ctpz | Дата: Пятница, 01 Июня 2012, 21:58 | Сообщение # 15 |
участник
Сейчас нет на сайте
| Quote (Lord135) Для начала нам нужно выбрать хостинг
Для начала думаю подойдёт и radyx.ru
Зачем же я выделенный сервер покупал. Только зря деньги потратил, да? 
Quote (Lord135) если пользователь расфокусирован
Quote (Lord135) если пользователь сфокусирован на текстовом поле
Сделал все как написано, свокусироваль взгляд на поле, а оно не работает.
P.S. СТЕБ, ONLY СТЕБ
|
|
|
| |
| vovnet | Дата: Пятница, 01 Июня 2012, 22:06 | Сообщение # 16 |
почетный гость
Сейчас нет на сайте
| даешь ООП
|
|
|
| |
| ctpz | Дата: Пятница, 01 Июня 2012, 22:39 | Сообщение # 17 |
|
участник
Сейчас нет на сайте
| vovnet, это ультрасовременные технологии. Куда нам до этого.
|
|
|
| |
