2013-07-29 3 views
0

У меня есть эти часы w3schools: http://www.w3schools.com/js/tryit.asp?filename=tryjs_timing_clockВыберите знаки пунктуации с JQuery

В принципе, я хотел бы сделать «:» мерцание. (видимый/скрытый) Я думаю, что я должен выбрать «:» с jQuery, а затем изменить свойство css видимости, но я не знаю, как они генерируются jQuery уже ...

Насколько я знаю, вы читаете, Regex может быть решением для выбора, но я не знаю, как его использовать.

Любая помощь будет замечательной!

ответ

2

Вы можете разделить различные части часов на пролеты. И положите «:» в класс.

HTML:

<body onload="startTime()"> 
    <div id="txt"> <span id="hours"></span><span class="blink">:</span><span id="minutes"></span><span class="blink">:</span><span id="seconds"></span> 
    </div> 

Вам также нужно добавить количество часов на отдельные пролеты, так что «:» не будут вставлять и вынимать каждый второй.

В конце вы инициализируете интервал, в котором вы применяете мерцающий эффект к классу «мигания».

JQuery:

function startTime() { 
    var today = new Date(); 
    var h = today.getHours(); 
    var m = today.getMinutes(); 
    var s = today.getSeconds(); 
    // add a zero in front of numbers<10 
    m = checkTime(m); 
    s = checkTime(s); 
    $("#hours").html(h); 
    $("#minutes").html(m); 
    $("#seconds").html(s); 
    t = setTimeout(function() { 
     startTime() 
    }, 500); 
} 

function checkTime(i) { 
    if (i < 10) { 
     i = "0" + i; 
    } 
    return i; 
} 

$(document).ready(function() { 
    startTime(); 
    $('.blink').each(function() { 
     var elem = $(this); 
     setInterval(function() { 
      if (elem.css('visibility') == 'hidden') { 
       elem.css('visibility', 'visible'); 
      } else { 
       elem.css('visibility', 'hidden'); 
      } 
     }, 500); 
    }); 
}); 

Вот рабочий пример:http://jsfiddle.net/UsnFR/

+0

Вот это точно! Большое спасибо за Вашу помощь! – Tanky

+0

Добро пожаловать. Укажите свой принятый ответ. знак равно – Naoe

Смежные вопросы