Перейти к содержимому


Фотография

[HowTo] Встраивание демок в дизайн сайта

Автор Santiago , сен 02 2014 21:26

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 36

#1 Santiago

Santiago

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 5 053 сообщений

Отправлено 02 Сентябрь 2014 - 21:26

Меня часто спрашивают, как можно встроить демки с нашего хостинга в дизайн сайта, минуя iframe.
 
Это можно сделать при помощи метода load() библиотеки jQuery
 
Скажем, к примеру, на сайте, в панели управления, ссылка выглядит так:
Для HLTV
<iframe src="http://www.myarena.ru/hltvdemos.php?home=0000&frame=1"></iframe>
Или для Source серверов:
<iframe src="http://www.myarena.ru/demos.php?home=0000&frame=1"></iframe>
 
Выбираем из этого кода прямую ссылку на демки:
http://www.myarena.ru/hltvdemos.php?home=0000&frame=1
или
http://www.myarena.ru/demos.php?home=0000&frame=1
Перейдя по такой ссылке мы видим в браузере готовую таблицу с демками. Так вот, чтобы вывести ее на странице, необходимо написать такой код:
<!-- Сам скрипт -->
<script>
    $(function(){
        $("#demosElement").load(
            // Наша ссылка на демки. Обязательно в кавычках!
            "http://www.myarena.ru/demos.php?home=0000&frame=1",
			
            // Псевдо-функция, которая сработает сразу после
	    function(){
	        // Занесение в массив таблицы с демками для последующей с ней работы.
		var tableDemos = $("table.demos");
				
		// Присвоение CSS классов для этой таблицы (В примере - для Bootstrap)
		tableDemos.addClass("table table-bordered table-condensed table-striped table-hover");
	    }
        );
    });
</script>

<!-- В этот элемент будут получена табличка с демками -->
<div id="demosElement" style="width: 100%; max-heigth: 500px; overflow: auto"></div>
Таким образом мы загрузили таблицу с демками в элемент ID demosElement, и присвоили ей новые CSS классы.
 
Так же можно задать просто стилями, например так:
tableDemos.css("{'border': '1px solid #c1c1c1', 'background-color': '#fff'}");
P.S. Чтобы именно этот код сработал, на сайте должна быть подключена библиотека jQuery.

#2 ykpon

ykpon

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 4 027 сообщений

Отправлено 07 Февраль 2015 - 18:38

Закрепи)


#3 Santiago

Santiago

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 5 053 сообщений

Отправлено 22 Март 2015 - 15:56

Закрепи)

Закрепил =)

#4 bySatana

bySatana

    Новичок

  • Пользователь
  • Pip
  • 35 сообщений

Отправлено 15 Апрель 2015 - 22:21

А как можно сделать, чтоб выводило скажем последние 10 демок?


#5 evgen66

evgen66

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 550 сообщений

Отправлено 30 Май 2017 - 13:28

Так у кого нибудь получилось таким образом вывести демо на sm 1.8 ? а то что мы попробывали и не получается.


#6 mrstark

mrstark

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 1 545 сообщений

Отправлено 05 Июнь 2017 - 17:09

Годно.

#7 Dangerous707

Dangerous707

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 778 сообщений

Отправлено 05 Июнь 2017 - 23:27

Так у кого нибудь получилось таким образом вывести демо на sm 1.8 ? а то что мы попробывали и не получается.

А при чём тут версия SourceMod?


#8 evgen66

evgen66

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 550 сообщений

Отправлено 07 Июнь 2017 - 7:43

А при чём тут версия SourceMod?

я не знаю,человек который в этом волокёт сказал так,у него на 34 версии ксс всё работает,могу переписку кинуть с ним.


#9 Dangerous707

Dangerous707

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 778 сообщений

Отправлено 07 Июнь 2017 - 7:52

я не знаю,человек который в этом волокёт сказал так,у него на 34 версии ксс всё работает,могу переписку кинуть с ним.

От версии SourceMod это никак не зависит. Достаточно иметь нормальный Web-сервер и переменную на игровом сервере, которая автоматически будет писать демки.


#10 evgen66

evgen66

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 550 сообщений

Отправлено 07 Июнь 2017 - 10:41

От версии SourceMod это никак не зависит. Достаточно иметь нормальный Web-сервер и переменную на игровом сервере, которая автоматически будет писать демки.

сервер пишет демки всегда,web сервер пытались использовать от myarena


#11 Dangerous707

Dangerous707

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 778 сообщений

Отправлено 07 Июнь 2017 - 11:22

сервер пишет демки всегда,web сервер пытались использовать от myarena

Вот тебе только что созданный пример - ПРИМЕР, ЖМИ БЫСТРЕЕЕЕЕЙ!
Вот примерный код, на основе которого я сейчас создал эту страничку:
 

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Тест встраивания демок</title>
</head>
<body>
<!-- Сам скрипт -->
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<script>
    $(function(){
        $("#demosElement").load(
            // Наша ссылка на демки. Обязательно в кавычках!
            "http://www.myarena.ru/demos.php?home=3867&frame=1",
			
            // Псевдо-функция, которая сработает сразу после
	    function(){
	        // Занесение в массив таблицы с демками для последующей с ней работы.
		var tableDemos = $("table.demos");
				
		// Присвоение CSS классов для этой таблицы (В примере - для Bootstrap)
		tableDemos.addClass("table table-bordered table-condensed table-striped table-hover");
	    }
        );
    });
</script>

<!-- В этот элемент будут получена табличка с демками -->
<div id="demosElement" style="width: 100%; max-heigth: 500px; overflow: auto"></div>
</body>
</html>

P.s.: демки в примере взяты с сервера CS:S v34 на слотовом тарифе.


#12 ykpon

ykpon

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 4 027 сообщений

Отправлено 07 Июнь 2017 - 12:41

Вот тебе только что созданный пример - ПРИМЕР, ЖМИ БЫСТРЕЕЕЕЕЙ!
Вот примерный код, на основе которого я сейчас создал эту страничку:
 

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Тест встраивания демок</title>
</head>
<body>
<!-- Сам скрипт -->
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<script>
    $(function(){
        $("#demosElement").load(
            // Наша ссылка на демки. Обязательно в кавычках!
            "http://www.myarena.ru/demos.php?home=3867&frame=1",
			
            // Псевдо-функция, которая сработает сразу после
	    function(){
	        // Занесение в массив таблицы с демками для последующей с ней работы.
		var tableDemos = $("table.demos");
				
		// Присвоение CSS классов для этой таблицы (В примере - для Bootstrap)
		tableDemos.addClass("table table-bordered table-condensed table-striped table-hover");
	    }
        );
    });
</script>

<!-- В этот элемент будут получена табличка с демками -->
<div id="demosElement" style="width: 100%; max-heigth: 500px; overflow: auto"></div>
</body>
</html>

P.s.: демки в примере взяты с сервера CS:S v34 на слотовом тарифе.

<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>

Лишнее.


#13 Dangerous707

Dangerous707

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 778 сообщений

Отправлено 07 Июнь 2017 - 12:48 

<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>

Лишнее.

 

Я на скорую руку из левого документа взял jQuery. Думаю, мне можно простить эту маленькую шалость. 


#14 evgen66

evgen66

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 550 сообщений

Отправлено 18 Июнь 2017 - 2:23

так и куда этот скрипт кидать?


Сообщение отредактировал evgen66: 18 Июнь 2017 - 2:24

#15 Dangerous707

Dangerous707

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 778 сообщений

Отправлено 18 Июнь 2017 - 3:06

так и куда этот скрипт кидать?

А куда над?


#16 evgen66

evgen66

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 550 сообщений

Отправлено 18 Июнь 2017 - 6:14

А куда над?

надо что бы был доступ к демкам с сервера на тарифе pro для всех игроков и что бы это всё было на  http://00000000.myarena.ru


#17 Dangerous707

Dangerous707

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 778 сообщений

Отправлено 18 Июнь 2017 - 13:39

надо что бы был доступ к демкам с сервера на тарифе pro для всех игроков и что бы это всё было на  http://00000000.myarena.ru

Недоступны демки на тарифе PRO.


#18 evgen66

evgen66

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 550 сообщений

Отправлено 18 Июнь 2017 - 15:53

Недоступны демки на тарифе PRO.

так я и говорю что нужно сделать с помощью этого скрипта вывод демок на сайт или куда ещё,кто может это сделать за определённую плату? неужели не у кого не получилось сделать ссылку на демки на тарифе pro?


#19 Dangerous707

Dangerous707

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 778 сообщений

Отправлено 18 Июнь 2017 - 16:02

так я и говорю что нужно сделать с помощью этого скрипта вывод демок на сайт или куда ещё,кто может это сделать за определённую плату? неужели не у кого не получилось сделать ссылку на демки на тарифе pro?

Лично я не шарю. Посредством конкретно этого способа нельзя вывести, ибо тут берётся фрейм с Арены, но на тарифе PRO нет этих демок для общего доступа. Ищи скрипт или людей, которые тебе напишут его за плату.


#20 evgen66

evgen66

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 550 сообщений

Отправлено 18 Июнь 2017 - 16:03

Лично я не шарю. Посредством конкретно этого способа нельзя вывести, ибо тут берётся фрейм с Арены, но на тарифе PRO нет этих демок для общего доступа. Ищи скрипт или людей, которые тебе напишут его за плату.

может есть кто на примете?


Обратно в Собственный сайт

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных

  1. Форум MyArena.ru
  2. → Наш WEB-хостинг
  3. → Собственный сайт
  4. Правила поведения на форуме