Обновить css при событии onchange [дублировать]

0

Мне было интересно, можно ли редактировать свойства css в событии onchange.

Мой скрипт HTML +

    <div class="Content">

        <input id="ColorSlider" type="range" min="0" max="360" value="25" onchange="showValue(this.value)"/>
        <div id="ColorViewer">
            Color value = 25
        </div>

        <script>
            function showValue(newValue){
                document.getElementById("ColorViewer").innerHTML= "Color value = " + newValue;
            //something here that sends the value to the css file

}

И мой CSS, который теперь получает переменные сеанса из другого PHP файла

<?php
header('Content-type: text/css');
    session_start();

    $CssBorder = $_SESSION['CssBorder'];
    $CssH1BackgroundColor = $_SESSION['CssH1BackgroundColor'];

?>

Можно ли отправить переменную (возможно, через сеанс PHP) в файл CSS. и изменить цвет границы HTML?

Для цели очистки я хочу, чтобы мой css файл был внешним.

  • 0
    @RUJordan это может, просто создайте файл PHP, вызовите заголовок, говорящий, что это css. и затем используйте это как переменную. <? php echo $ CssH1BackgroundColor?>
Теги:
session
events

3 ответа

2
Лучший ответ

Для этого вам действительно не нужно использовать PHP. Это можно сделать с помощью javascript.

<script>
function showValue(newValue){
    document.getElementById("ColorViewer").innerHTML= "Color value = " + newValue;
    //something here that sends the value to the css file
    document.getElementById("ColorViewer").style.border = "[width] [style] [colour]";
}
</script>

Если, однако, вы абсолютно должны динамически загружать созданную внешнюю таблицу стилей, тогда вам может понадобиться следующая ссылка, использующая jQuery:

Как загрузить файлы CSS с помощью Javascript?

Также ваш PHP файл CSS, вероятно, лучше реагирует с использованием переменных $_GET[] а не $_SESSION[], поскольку вы не сможете установить переменную сеанса из HTML-кода пользователя.

  • 0
    Большое спасибо, это может помочь мне. И объяснить дальше. Я не использую HTML для создания своих страниц. У меня стандартная планировка с HTML CSS. и используйте index.php для создания объекта, такого как контент, заголовок, ссылки на файлы, чтобы иметь возможность создавать очень динамичный веб-сайт, который легко редактировать. Но я не знал, что вы можете изменить стиль только с помощью JavaScript. большое Вам спасибо
  • 0
    Вы решили мою проблему, Большое спасибо, никогда не думал, что это будет так просто.
0

Если вы хотите взять данные с сеанса, вы можете следовать с AJAX.

function showValue(newValue){ 
      $("#ColorViewer").html("Color value = " + newValue);
      $.get("sessionpage.php",function(data,status){  //print green,blue from session, seperated using comma.
           var colors = data; //"green,blue";
           var colorsArray =colors.split(",");
           var CssBorder = colorsArray[0];
           var CssH1BackgroundColor= colorsArray[1];
           $("#ColorViewer").css('background-color', CssH1BackgroundColor);
           $("#ColorViewer").css("border","5px solid");
           $("#ColorViewer").css("border-color",CssBorder );
      });

}

Для изменения цвета с помощью jquery

function showValue(newValue){ 
   $("#ColorViewer").html("Color value = " + newValue);
   $("#ColorViewer").css('background-color', "green");
   $("#ColorViewer").css("border","5px solid blue");

}
0

Самый простой способ - включить требуемый css в html-страницу. Вы можете использовать немного javascript, чтобы все было сделано. Если вам нужно сохранить css во внешнем файле, вам нужно будет сгенерировать его с помощью PHP. Затем отправьте цвет обратно на сервер, заново создайте файл css и снова выполните страницу. Кажется немного сложным имхо.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню