Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Ячейка как ссылка (всплывающее окно на jquery)? / 11 сообщений из 11, страница 1 из 1
17.05.2013, 18:51
    #38262589
Alex-Mi
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
Доброго дня, люди добрые, подскажите как вызвать всплывающее окно при клике на всю область ячейки?
Код: html
1.
<a href="#popup1" name="loadpopunder">Ссылка</a>

При клике на "Ссылка" всплывающее окно нормально открывается, но как задействовать всё поле ячейки в таблице - как ссылку?
Пробовал таким образом, при нажатии на ячейку ничего не происходит.
Код: html
1.
<td class="td1" onClick="document.location='#popup1'" name="loadpopunder"></td>


Используется следующий скрипт всплывающего окна
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
//Pop-under only once per browser session? (0=no, 1=yes)
//Specifying 0 will cause popunder to load every time page is loaded
var once_per_session=1

//No editing beyond here required
function get_cookie(Name) {
  var search = Name + "=", returnvalue = "";
  if (document.cookie.length > 0) {
    offset = document.cookie.indexOf(search)
    if (offset != -1) { // if cookie exists
      offset += search.length
      end = document.cookie.indexOf(";", offset);
      if (end == -1)
         end = document.cookie.length;
      returnvalue=unescape(document.cookie.substring(offset, end))
      }
   }
  return returnvalue;
}

function loadornot(){
    if (get_cookie('popunder')==''){
        loadpopunder();
        document.cookie="popunder=yes";
    }
}
function loadpopunder(){
var id = '#popup1';
	
		//Get the screen height and width
		var mask1Height = jQuery(document).height();
		var mask1Width = jQuery(window).width();
	
		//Set heigth and width to mask to fill up the whole screen
		jQuery('#mask1').css({'width':mask1Width,'height':mask1Height});
		
		//transition effect		
		jQuery('#mask1').fadeIn(1000);	
		jQuery('#mask1').fadeTo("slow",0.8);	
	
		//Get the window height and width
		var winH = jQuery(window).height();
		var winW = jQuery(window).width();
              
		//Set the popup window to center
		jQuery(id).css('top',  winH/2-jQuery(id).height()/2);
		jQuery(id).css('left', winW/2-jQuery(id).width()/2);
	
		//transition effect
		jQuery(id).fadeIn(2000);
}
jQuery(document).ready(function() {
    jQuery('a[name=loadpopunder]').click(function(e) {
        e.preventDefault();
        var id = jQuery(this).attr('href');
        loadpopunder(id); // вызываем по клику
    });
    jQuery('.window1 .close1').click(function (e) {
        e.preventDefault();
        jQuery('#mask1, .window1').hide();
    });
    jQuery('#mask1').click(function () {
        jQuery(this).hide();
        jQuery('.window1').hide();
    });
});


Заранее очень благодарен!
Модератор: Просьба использовать тэги для кода. По случаю первого поста не удалено.
[IDV]
...
Рейтинг: 0 / 0
17.05.2013, 22:07
    #38262798
asws
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
Хоть и не работаю с jQuery, но по-логике должно быть
"td[name=loadpopunder]"
...
Рейтинг: 0 / 0
17.05.2013, 23:31
    #38262882
Alex-Mi
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
Где именно?
...
Рейтинг: 0 / 0
17.05.2013, 23:37
    #38262886
asws
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
Alex-MiГде именно?Ну что всё разжевать?
Начните с добавления копии блока: jQuery('a[name=loadpopunder]').click(function(e) { ... }
только учтите, что у td нет атрибута href , придумайте другой способ.
...
Рейтинг: 0 / 0
18.05.2013, 20:04
    #38263504
катастрофа
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
asws,
это типа как здесь
http://www.cyberforum.ru/android-dev/
при наведении на ячейку таблицы?
если можно разжевать...
...
Рейтинг: 0 / 0
18.05.2013, 22:58
    #38263613
user89
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
Alex-Miкак вызвать всплывающее окно при клике на всю область ячейки Прикладываю файлик. Там минимум JavaScript...
...
Рейтинг: 0 / 0
19.05.2013, 15:38
    #38263849
катастрофа
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
user89, ясно.
Спасибо, но не ясно как к тому же при наведении подсказку заиметь
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style>
table {
border-collapse:collapse;
}

td {
border:1px solid #C0C0C0;
padding: 4px;
}

td:hover {
background: #f3bd48; /* Цвет фона при наведении */
color: #fff; /* Цвет текста при наведении */
}
</style>
<script type='text/javascript'>
function show(id) {document.getElementById(id).style.display = 'block';}
function hide(id) {document.getElementById(id).style.display = 'none';}
</script>
</head>
<body>
<table>
<tr><td>Нет данных в ячейке...</td><td onClick="show('over'); show('wnd');">Нажать в любую облать ячейки</td></tr>
</table>
</body>
</html>
...
Рейтинг: 0 / 0
20.05.2013, 10:27
    #38264112
user89
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
катастрофа,

По мотивам http://html-css.info/2010/02/tooltip-title-css/
Проверял в Опере, Мозилле, Хромом
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
<!DOCTYPE html>
<html>
<head>
<style>
table {
	border-collapse:collapse;
}
td {
	border:1px solid #C0C0C0;
	padding: 4px;
}
.ToolTip{
	position:absolute;
}
.ToolTip em{display:none;}
.ToolTip:hover em{
	display:block;
	position:absolute;
 	background-color:#000;
 	border-radius:5px;
	color:#FFF;
	padding:3px 5px;
	bottom:27px;
	right:0;
}
.ToolTip:hover em tri{
	position:absolute;
	bottom:-7px;
	right:5px;
	border-top:7px solid #000;
	border-left:7px solid transparent;
	display:block;
	height:0;
	overflow:hidden;
}
</style>
</head>
<body>
<br><br>
<table>
<tr><td>Нет данных в ячейке...</td><td class="ToolTip">Здесь есть данные<em>Подсказка<tri></tri></em></td></tr>
</table>
</body>
</html>


...
Рейтинг: 0 / 0
20.05.2013, 18:28
    #38265063
катастрофа
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
user89, спасибо!!
...
Рейтинг: 0 / 0
21.05.2013, 10:49
    #38265733
mage.lan
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
user89,

не надо браузеру крышу сносить, так тоже будет работать.
Код: html
1.
2.
3.
.ToolTip{
	position:relative;
}
...
Рейтинг: 0 / 0
21.05.2013, 12:09
    #38265943
user89
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ячейка как ссылка (всплывающее окно на jquery)?
mage.lan,

да я так и начал. Если подсказку вешать на <span> , то всё ОК, но в Мозилле, на <td> окно всплывает внизу экрана.
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Ячейка как ссылка (всплывающее окно на jquery)? / 11 сообщений из 11, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]