This forum uses cookies
This forum makes use of cookies to store your login information if you are registered, and your last visit if you are not. Cookies are small text documents stored on your computer; the cookies set by this forum can only be used on this website and pose no security risk. Cookies on this forum also track the specific topics you have read and when you last read them. Please confirm that you accept these cookies being set.

Circularslider css
#6
Hi Joep, 

Can you share the icon ?


(03.10.2023, 13:54)Joep Wrote: Here's the result using a rotated icon as the sun. I used the custom Javascript code below to make it work. The first code is to rotate the sun regarding the azimut value. The second code is to hide the sun icon when the altitude value has become 0.

[Image: azimut.png]

Code:
$(function(){
  $('.azimut').each(function(i, el) {
    var $el = $(el), addr = $el.data('object'); // or 'status-object'

    grp.listen(addr, function(obj) {
      $el.each(function () {
        this.style.setProperty('transform', 'rotate(' + obj.value + 'deg)', 'important');
      });
    });
  });
});

Code:
$(function(){
  $('.altitude').each(function(i, el) {
    var $el = $(el), addr = $el.data('object'); // or 'status-object'

    grp.listen(addr, function(obj) {
      if (obj.value == 0) {
        $('.azimut').addClass('hide');
      } else {
        $('.azimut').removeClass('hide');
      }
    });
  });
});
Reply


Messages In This Thread
Circularslider css - by Joep - 02.10.2023, 15:17
RE: Circularslider css - by AlexLV - 03.10.2023, 07:25
RE: Circularslider css - by Joep - 03.10.2023, 09:01
RE: Circularslider css - by admin - 03.10.2023, 07:31
RE: Circularslider css - by Joep - 03.10.2023, 13:54
RE: Circularslider css - by Fahd - 03.10.2023, 16:51
RE: Circularslider css - by Joep - 04.10.2023, 08:05

Forum Jump: