Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.11.2018, 09:03
Новичок на форуме
Отправить личное сообщение для LaymMan Посмотреть профиль Найти все сообщения от LaymMan
 
Регистрация: 15.11.2018
Сообщений: 5

Как вывести данные из JS в CSS
Есть такой код JS:
$(document).ready(function(){
    window.addEventListener('message', function(event) {
        var data = event.data;
        $(".container-fluid").css("display",data.show? "none":"block");
        $("#armor").css("width",data.armor);
        $("#health").css("width",data.health);
        $("#hunger").css("width",100 - data.hunger);
        $("#thirst").css("width",100 - data.thirst);
    });
});

Нужно вывести data.Health в stroke-dasharray(CSS). Пытался через
Код:
$(".circle").css("stroke-dasharray",data.health);
но он выводит одно число, а нужно два. Пример: stroke-dasharray: 50 100, где 50 это data.Health, а 100 константа.

Последний раз редактировалось LaymMan, 15.11.2018 в 09:47.
Ответить с цитированием
  #2 (permalink)  
Старый 15.11.2018, 09:13
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

Попробуйте так:
$('svg .circle').get(0).style.cssText+=';stroke-dasharray:('+data.Health+',100);';


upd. если это атрибут, то можно так попробовать:
$('svg .circle').get(0).setAttribute('stroke-dasharray','('+data.Health+',100)');

Последний раз редактировалось Nexus, 15.11.2018 в 09:15.
Ответить с цитированием
  #3 (permalink)  
Старый 15.11.2018, 09:14
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

LaymMan,
$('svg .circle').attr('stroke-dasharray',data.Health+' 100');

Последний раз редактировалось рони, 15.11.2018 в 09:29.
Ответить с цитированием
  #4 (permalink)  
Старый 15.11.2018, 09:25
Новичок на форуме
Отправить личное сообщение для LaymMan Посмотреть профиль Найти все сообщения от LaymMan
 
Регистрация: 15.11.2018
Сообщений: 5

Сообщение от Nexus Посмотреть сообщение
Попробуйте так:
$('svg .circle').get(0).style.cssText+=';stroke-dasharray:('+data.Health+',100);';


upd. если это атрибут, то можно так попробовать:
$('svg .circle').get(0).setAttribute('stroke-dasharray','('+data.Health+',100)');
Извините пожалуйста, раньше stroke-dasharray стоял в html, не то написал. Должно быть stroke-dasharray: 50 100
Ответить с цитированием
  #5 (permalink)  
Старый 15.11.2018, 09:27
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

LaymMan, ну так удалите скобочки и запятую на пробел замените, с этим, я уверен, вы справитесь.
Ответить с цитированием
  #6 (permalink)  
Старый 15.11.2018, 09:32
Новичок на форуме
Отправить личное сообщение для LaymMan Посмотреть профиль Найти все сообщения от LaymMan
 
Регистрация: 15.11.2018
Сообщений: 5

Все ответы не работают.
Ответить с цитированием
  #7 (permalink)  
Старый 15.11.2018, 10:02
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

LaymMan, консоль смотрели?
У вас элемент 'svg .circle' вообще есть?
Ответить с цитированием
  #8 (permalink)  
Старый 15.11.2018, 10:13
Новичок на форуме
Отправить личное сообщение для LaymMan Посмотреть профиль Найти все сообщения от LaymMan
 
Регистрация: 15.11.2018
Сообщений: 5



В HTML с svg и attr вот этот скрипт работает:
$("svg .circle").attr("stroke-dasharray",data.health);

Без svg, но с css работает в CSS. Ваши не там, не там не работают.
Ответить с цитированием
  #9 (permalink)  
Старый 15.11.2018, 10:32
Новичок на форуме
Отправить личное сообщение для LaymMan Посмотреть профиль Найти все сообщения от LaymMan
 
Регистрация: 15.11.2018
Сообщений: 5

Всем спасибо большое, я тупой. health с маленькой буквы нужно писать.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывести введенные данные в форму на другой странице в таблицу посредством javascript MarynaZ Общие вопросы Javascript 4 09.10.2017 12:19
как передавать данные из html? carder Общие вопросы Javascript 5 27.02.2016 19:46
Как вывести даты на JS? mrbanan Общие вопросы Javascript 4 11.12.2015 20:12
Как вывести информацию что JS выключен? PAMAC Общие вопросы Javascript 5 09.03.2011 20:24
Как вывести содержимое PHP файла с помощью JS? pavdin Серверные языки и технологии 6 22.12.2010 14:16