все так просто) именно на странице с таблицей не работает, а на всех остальных все показывает, буду разбираться. Спасибо)
|
<area id="squidhead" title="Статус: Свободна " alt="Link" data-maphilight="{"stroke":false,"fillColor":"fdff5a","fillOpacity":0.6}" /> при наведении сделал всплывающий title с помощью tooltip, вот думаю сделать изменение цвета шрифта при условии, что title содержит слово (свободна) <script> $(function(){ var x = $("area title").text(); if (x == "Свободна") $('area title').css({color: '#fff'); }); </script> но что-то ничего не получается, ни какой реакции в изменении цвета, что делаю не так? |
Цитата:
|
а как я его сделаю если он не работает
|
Цитата:
Цитата:
|
Цитата:
Или можно предложить другие варианты решения... |
.tooltip отвечает за оформление атрибута title, но и его использование не помогает
|
РустамRu, т.е. тестовый пример от тебя мы так и не увидим? :(
|
<!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> .tooltip{ position:absolute; z-index:60; left:-9999px; background:#8db24b; padding:5px 5px 5px 20px; max-width:108px; height:81px; font-size:14px; } </style> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <script type="text/javascript" src="<?php echo bloginfo('template_directory'); ?>/js/jquery.maphilight.js"></script> <script type="text/javascript" src="<?php echo bloginfo('template_directory'); ?>/js/scriptetag.js"></script> <script type="text/javascript"> function simple_tooltip(target_items, name){ $(target_items).each(function(i){ $("body").append("<div class='"+name+"' id='"+name+i+"'><p>"+$(this).attr('title')+"</p></div>"); var my_tooltip = $("#"+name+i); $(this).removeAttr("title").mouseover(function(){ my_tooltip.css({opacity:1, display:"none"}).fadeIn(10); }).mousemove(function(kmouse){ my_tooltip.css({left:kmouse.pageX+15, top:kmouse.pageY+0}); }).mouseout(function(){ my_tooltip.fadeOut(10); }); }); } $(document).ready(function(){ simple_tooltip("area","tooltip"); }); </script> <script> $(function(){ var x = $("area title").text(); if (x == "Свободна") $('area title').css({color: '#fff'); }); </script> </head> <body> <img src="" width="100" height="30" class="map" usemap="#simple" /> <map name="simple"> <area id="squidhead" title="Статус: Свободна " alt="Link" data-maphilight="{"stroke":false,"fillColor":"fdff5a","fillOpacity":0.6}" /> </map> </body> </html> вот) |
РустамRu,
что-то у вас с логикой сначала атрибут удалить потом его искать ... где } строка 48 <!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> .tooltip{ position:absolute; z-index:60; left:-9999px; background:#8db24b; padding:5px 5px 5px 20px; max-width:108px; height:81px; font-size:14px; } </style> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <script type="text/javascript" src="<?php echo bloginfo('template_directory'); ?>/js/jquery.maphilight.js"></script> <script type="text/javascript" src="<?php echo bloginfo('template_directory'); ?>/js/scriptetag.js"></script> <script type="text/javascript"> function simple_tooltip(target_items, name){ $(target_items).each(function(i){ $("body").append("<div class='"+name+"' id='"+name+i+"'><p>"+$(this).attr('title')+"</p></div>"); var my_tooltip = $("#"+name+i); $(this) //.removeAttr("title") .mouseover(function(){ my_tooltip.css({opacity:1, display:"none"}).fadeIn(10); }).mousemove(function(kmouse){ my_tooltip.css({left:kmouse.pageX+15, top:kmouse.pageY+0}); }).mouseout(function(){ my_tooltip.fadeOut(10); }); }); } $(document).ready(function(){ simple_tooltip("area","tooltip"); }); </script> <script> $(function(){ var x = $("area").attr("title"); if (x == "Статус: Свободна ") $('area').css({color : '#fff'}); alert($('map').html()) }); </script> </head> <body> <img src="" width="100" height="30" class="map" usemap="#simple" /> <map name="simple"> <area id="squidhead" title="Статус: Свободна " alt="Link" data-maphilight="{"stroke":false,"fillColor":"fdff5a","fillOpacity":0.6}" /> </map> </body> </html> |
Часовой пояс GMT +3, время: 00:12. |