Новости Joomla

0 Пользователей и 1 Гость просматривают эту тему.
  • 22 Ответов
  • 552 Просмотров
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Ребят, есть сайт http://relizfm.ru/ . Вывод трека осуществляется с помощью вставки контейнера в код сайта <div id="radiostat">Загрузка...</div> . Задача такова - нужно отцентровать эту надпись и сделать красным цветом. Подскажете как это сделать? !
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #1 : 07.02.2020, 13:16:53 »
отцентровать именно посередине?
если да то уберите его из блока футера как минимум
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #2 : 07.02.2020, 13:19:14 »
отцентровать именно посередине?
если да то уберите его из блока футера как минимум
Тогда вывод трека идет с левого края вообще. Да именно по середине. не силен в программировании, знаю что поможет "center-block", но не знаю как это использовать
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #3 : 07.02.2020, 13:20:55 »
Тогда вывод трека идет с левого края вообще. Да именно по середине. не силен в программировании, знаю что поможет "center-block", но не знаю как это использовать
так поставьте в ту же позицию где плеер
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #4 : 07.02.2020, 13:24:47 »
так поставьте в ту же позицию где плеер
<html id="home">
  <head>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
      <script>
                            function nowplay()
                            {
                                $.ajax({
                                    url: "/radiostat.php",  //Тут указываем файл со скриптами
                                    cache: false,
                                    success: function(html){
                                        $("#radiostat").html(html); //Контейнер для вывода информации
                                    }
                                });
                            }

                            $(document).ready(function(){
                                nowplay();
                                setInterval('nowplay()',30000);  //Время в милесекундах, 30000=30сек
                            });
                        </script>
        <jdoc:include type="head" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="/templates/protostar/css/vendor.min.css?v=2" type="text/css" rel="stylesheet">
    <link href="/templates/protostar/css/main.min.css?v=2" type="text/css" rel="stylesheet">
    <link href="/templates/protostar/css/add.css" type="text/css" rel="stylesheet">
  <link rel="stylesheet" href="http://cdn.radioheart.ru/tools/widget/style.css" />   
  </head>
<body>       
<div class="_wraph-bckg"></div>
<div class="_wraph">
    <div class="logos">
   
      <img src="/img/logo.png" alt="">
      </div>
       <section class="_wraph-s clearfix">
        <div class="logotype">
            <div class="tp-caption     rev_group" id="slide-14-layer-4" style="transition: none 0s ease 0s; text-align: inherit; line-height: 0px; border-width: 0px; margin: 0px; padding: 0px; letter-spacing: 0px; font-weight: 400; font-size: 13px; white-space: nowrap; min-height: 302px; min-width: 460px; max-height: 302px; max-width: 460px;">
<div class="tp-parallax-wrap" style="position: absolute;display: block;visibility: visible;left: 180px;top: 2px;z-index: 6;">
<div class="tp-loop-wrap" style="position:absolute;display:block;;">
<div class="tp-mask-wrap" style="position: absolute; display: block; overflow: visible;">
             
<div class="" id="slide-14-layer-3" style="z-index: 6; visibility: inherit; transition: none 0s ease 0s; text-align: inherit; line-height: 0px; border-width: 0px; margin: 0px; padding: 0px; letter-spacing: 0px; font-weight: 400; font-size: 11px; white-space: nowrap; min-height: 0px; min-width: 0px; max-height: none; max-width: none; opacity: 1; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);">

<img src="/images/record.png" width="450" height="450" style="width: 352.242px;height: 352.242px;transition: none 0s ease 0s;text-align: inherit;line-height: 0px;border-width: 0px;margin: 0px;padding: 0px;letter-spacing: 0px;font-weight: 400;font-size: 10px;" class="rot">
</div>
</div>
</div>
</div>
<div class="tp-parallax-wrap" style="position: absolute; display: block; visibility: visible; left: 0px; top: 2px; z-index: 7;">
  <div class="tp-loop-wrap" style="position:absolute;display:block;;">
    <div class="tp-mask-wrap" style="position: absolute; display: block; overflow: visible;">
      <div class="tp-caption   tp-resizeme rev_layer_in_group" id="slide-14-layer-2" style="z-index: 7; visibility: inherit; transition: none 0s ease 0s; text-align: inherit; line-height: 0px; border-width: 0px; margin: 0px; padding: 0px; letter-spacing: 0px; font-weight: 400; font-size: 11px; white-space: nowrap; min-height: 0px; min-width: 0px; max-height: none; max-width: none; opacity: 1; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);">
        <img src="/images/logo.png" alt="" height="450" data-no-retina="" style="width: 355.581px;height: 352.581px;transition: none 0s ease 0s;text-align: inherit;line-height: 0px;border-width: 0px;margin: 0px;padding: 0px;letter-spacing: 0px;font-weight: 400;font-size: 10px;">
      </div>
     </div>
     </div>
</div>
</div>         
</div>
<div class="navigation">
<jdoc:include type="modules" name="play" />
</div>
</section>
<div class="_hidden"></div>
    <link href="/templates/protostar/css/stylesheet.min.css" type="text/css" rel="stylesheet">
</div>
    <style>
    @keyframes spin {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}

img.rot{
  animation: spin 5s linear 0s infinite;
}
    </style>
<jdoc:include type="modules" name="debug" />
  <section class="_wraph">
        <div class="footer-block">
            <div class="right-block">
                <div class="contacts">
                    <div class="contacts__title">Контакты:</div>
                    <div class="contacts__text">ООО "АССОРТИ МЕДИА"<br>Телефон рекламной службы<br><span>8 (937) 368-83-73</span><br>
                        relizfm@gmail.com
                    </div>
                                        <a target="_blank" href="https://vk.com/radioreliz" class="vk">Мы ВКонтакте</a>

                </div>
            </div>
        </div>
    </section>
  </body>
</html>

Пдскажете куда именно? 3 день уже голову ломаю и что-то никак не удается? Нужно чтобы вывод трека был под кнопкой запуска трека
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #5 : 07.02.2020, 13:30:28 »
пробуйте после этого
Код
img.rot{  animation: spin 5s linear 0s infinite;}
    </style>
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #6 : 07.02.2020, 13:38:06 »
пробуйте после этого
Код
img.rot{  animation: spin 5s linear 0s infinite;}
    </style>
Вставил <div id="radiostat">Загрузка...</div> после того, что вы указали - вообще вывод трека пропал
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #7 : 07.02.2020, 13:40:32 »
как у вас вывод организован вообще
именно плеера?


модулем или как?
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #8 : 07.02.2020, 13:42:36 »
как у вас вывод организован вообще
именно плеера?


модулем или как?

КОНСТРУКТОР СКРИПТОВ
Создаем файл radiostat.php, вносим в него следующий код и сохраняем в корне сайта:
<?php
                            //НАСТРОЙКИ СКРИПТА//
                            //Ссылка на картинку, которая будет отображаться, если изображение не найдено в базе LAST.FM
                            $no_photo_url='http://upload.wikimedia.org/wikipedia/commons/3/37/No_person.jpg';
                            $width='100'; //ширина картинки
                            $height='100';  //высота картинки
                            //НЕ ИЗМЕНЯЙТЕ НИЧЕГО НИЖЕ///
                            //LIVE STREAM
                            $data = json_decode(file_get_contents("http://a1.radioheart.ru:8030/json.xsl?mount=/RH22511"));
                            if (!count($data->mounts) || strlen($data->mounts[0]->server_name) < 2) {
                                //NONSTOP
                                $data = json_decode(file_get_contents("http://a1.radioheart.ru:8030/json.xsl?mount=/nonstop"));
                            }
                            $stream_title = $data->mounts[0]->server_name;
                            //Если сайт в кодировке windows-1251 (cp-1251), раскомментируйте следующую строчку
                            //$stream_title = iconv("UTF-8", "WINDOWS-1251", $stream_title);
                            $stream_description = $data->mounts[0]->description;
                            $listeners = $data->mounts[0]->listeners;
                            $song = $data->mounts[0]->title;
                            $image = '';
                            //Если сайт в кодировке windows-1251 (cp-1251), раскомментируйте следующую строчку
                            //$song = iconv("UTF-8", "WINDOWS-1251", $song);
                            $artist = explode(" - ", $song);
                            $artist = $artist[0];
                            $artist = str_replace(" ", " ", $artist);
                            $size = "large";
                                                        // Выводим данные
                            echo "<div id='radiostat'>";
                                                                                                               
                            echo "Сейчас в эфире: $song<br />";
                                                       
                            echo "</div>";
                           
                            ?>
Добавляем контейнер на сайте, где должна отображаться информация:
<div id="radiostat">Загрузка...</div>
Подключаем библиотеку Jquery между тегами <head> и </head> , если она у вас еще не подключена!
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
Вставляем между тегами <head> и </head> в код сайта после подключения Jquery

                        <script>
                            function nowplay()
                            {
                                $.ajax({
                                    url: "/radiostat.php",  //Тут указываем файл со скриптами
                                    cache: false,
                                    success: function(html){
                                        $("#radiostat").html(html); //Контейнер для вывода информации
                                    }
                                });
                            }

                            $(document).ready(function(){
                                nowplay();
                                setInterval('nowplay()',30000);  //Время в милесекундах, 30000=30сек
                            });
                        </script>
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #9 : 07.02.2020, 13:48:59 »
попробуйте тогда перед </body>
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #10 : 07.02.2020, 13:51:37 »
Загрузка...

Не помогло( вывода также нет
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #11 : 07.02.2020, 13:55:34 »
блок выводится но содержимого не видно
попробуйте перед
</section>
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #12 : 07.02.2020, 14:03:23 »
блок выводится но содержимого не видно
попробуйте перед
</section>

Поставил перед </section> - и вывод трека в левом нижнем углу. можете посмотреть сами relizfm.ru
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #13 : 07.02.2020, 14:05:57 »
ну теперь
стиль блоку пропишите
text-align: center;
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #14 : 07.02.2020, 14:09:34 »
ну теперь
стиль блоку пропишите
text-align: center;
прописать в CSS? если да, то не понимаю где взять название этого блока - исходя из его id?
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #15 : 07.02.2020, 14:10:35 »
Код
#radiostat{
text-align:center;
}
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #16 : 07.02.2020, 14:16:13 »
а еще лучше поместить перед
<div class="footer-block">
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #17 : 07.02.2020, 14:24:06 »
а еще лучше поместить перед
<div class="footer-block">
Отцентровка выполнена - за что признателен, но надо как-то поднять вывод выше, сейчас он в самом низу, вставка перед <div class="footer-block"> - не помогла поднять. И еще вопрос - чтобы выделить жирным и сделать красного цвета надо также прописать эти изменения в стиле?
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #18 : 07.02.2020, 14:33:01 »
Отцентровка выполнена - за что признателен, но надо как-то поднять вывод выше, сейчас он в самом низу, вставка перед <div class="footer-block"> - не помогла поднять. И еще вопрос - чтобы выделить жирным и сделать красного цвета надо также прописать эти изменения в стиле?
да изменения в стиле
поднимается он только вместе с блоком футера
вам похорошему в шаблоне надо правки вносить по блокам
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #19 : 07.02.2020, 14:43:34 »
да изменения в стиле
поднимается он только вместе с блоком футера
вам похорошему в шаблоне надо правки вносить по блокам

Спасибо! Все равно очень помогли! Сделал жирным цветом и красного цвета, но пришлось поставить над кнопкой включения трека.
*

AlexB

  • Завсегдатай
  • 1973
  • 54 / 2
Re: Отцентровка вывода названия трека
« Ответ #20 : 07.02.2020, 14:46:08 »
ну добавьте для красоты еще отступ снизу
типа
margin-bottom: 50px;
*

stitch808

  • Захожу иногда
  • 146
  • 0 / 0
Re: Отцентровка вывода названия трека
« Ответ #21 : 07.02.2020, 14:54:13 »
ну добавьте для красоты еще отступ снизу
типа
margin-bottom: 50px;
Поставил. Спасибо большое!
*

Шмайсер

  • Давно я тут
  • 801
  • 35 / 3
Re: Отцентровка вывода названия трека
« Ответ #22 : 07.02.2020, 18:36:25 »
В большинстве случаев такого рада задачи решаются с помощью text-align: center !important;
Разработка сайтов любой сложности, на Joomla 3.9-4.x и не только на ней. Пишу компоненты, модули и плагины на заказ. Переношу сайты с ветки 2.5.х на 4-ю версию Joomla. Пишу любые скрипты и интерфейсы.
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Собственный макет вывода материалов для категории

Автор kolhoz

Ответов: 1
Просмотров: 383
Последний ответ 02.11.2021, 04:13:51
от draff
Как фильтровать список вывода материалов по принадлежности к категории?

Автор Damarkuzz

Ответов: 0
Просмотров: 353
Последний ответ 23.07.2021, 19:56:10
от Damarkuzz
Модуль вывода категорий с функцией ajax

Автор Damarkuzz

Ответов: 3
Просмотров: 516
Последний ответ 26.06.2021, 10:41:31
от Damarkuzz
Как резделить вёрстку вывода поиска com_search?

Автор Damarkuzz

Ответов: 1
Просмотров: 659
Последний ответ 11.06.2021, 19:23:39
от R31rus
Условия вывода модуля при определенном разрешении экрана

Автор Ruslan Chester

Ответов: 9
Просмотров: 2623
Последний ответ 14.03.2021, 13:20:25
от radiant