Javascript.RU

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

лола помогите
добрый вечер,как можно сделать в inpute типы подсказке нельзя вводить цифры на js,ajax,jquery
то что я написала можете не смотрит,это просто добавила

//
<script type="text/javascript">
$(function () {
$('.real-show-hint').on("click", function(e){
e = e || window.event;
e.preventDefault();
var ypos = $(this).offset().top+24;
var xpos = $(this).offset().left;
var RealHint = $(this).data('hint');
$(RealHint).css('top',ypos);
$(RealHint).css('left',xpos);
$(RealHint).toggle('fast');
return;
});
$('.prm-cross').on('click', function(){
$(this).parent().hide('fast');
return false;
});
document.onclick = function(e){
if ($(e.target).hasClass('real-hint')==false)
$('.real-hint').hide('fast');
return;
}
});
</script>
<style type="text/css">
.real-hint {
background-color: #fff;
border: 1px solid #aaa;
border-radius: 10px;
display: none;
padding: 5px 10px;
position: absolute;
width: 250px;
z-index: 99;
}

.real-hint .hint-caption {
font-weight: bold;
text-transform: uppercase;
}

.real-hint .prm-cross {
background: url("/images/cross.jpg") no-repeat scroll right top rgba(0, 0, 0, 0);
cursor: pointer;
float: right;
height: 16px;
margin-top: 3px;
padding-left: 15px;
right: 10px;
width: 16px;
}

.real-show-hint {
cursor: pointer;
border-bottom: dashed 1px;
color: #8c0000;
}
</style>
<div id="real-hint-1" class="real-hint">
<div class="prm-cross"></div>
<span class="hint-caption">Подсказка 1.</span><br/>
Вы нажали на первую ссылку
</div>

<div id="real-hint-2" class="real-hint">
<div class="prm-cross"></div>
<span class="hint-caption">Подсказка 2.</span><br/>
Вы нажали на вторую ссылку
</div>
<span class="real-show-hint" data-hint="#real-hint-1" >Ссылка на подсказку 1</span>
<span class="real-show-hint" data-hint="#real-hint-2" >Ссылка на подсказку 2</span>
**
<div id="tooltip"></div>
#tooltip {
z-index: 9999;
position: absolute;
display: none;
top:0px;
left:0px;
width: 342px;
background-color: #fff;
padding: 5px 10px 5px 10px;
color: #000;
border: 1px solid #888;
border-radius: 5px;
box-shadow: 0 1px 2px #555;
box-sizing: ;
}
<p><span data-tooltip="Подсказка номер 1">Подсказка 1</span> | <span data-tooltip="Подсказка номер 2">Подсказка 2</span></p>
$(function(){
$("[data-tooltip]").mousemove(function (eventObject) {
$data_tooltip = $(this).attr("data-tooltip");
$("#tooltip").text($data_tooltip)
.css({
"top" : eventObject.pageY + 5,
"left" : eventObject.pageX + 5
})
.show();
}).mouseout(function () {
$("#tooltip").hide()
.text("")
.css({
"top" : 0,
"left" : 0
});
});
})
Ответить с цитированием
  #2 (permalink)  
Старый 28.12.2016, 06:03
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

Лола, http://javascript.ru/formatting
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
помогите разобраться с this uroboros7 jQuery 4 02.01.2015 00:56
Помогите с fancyBox Le-mark43 Events/DOM/Window 6 20.12.2012 08:08
Помогите решить задачку. Андрей_ Javascript под браузер 3 26.06.2012 16:21
Помогите с replace! faforty Общие вопросы Javascript 2 28.08.2011 13:10
Помогите! Многоуровневые вкладки! sergeeeeee Элементы интерфейса 2 02.08.2010 23:50