X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Всплывающая картинка над ссылкой
LordNighton
LordNighton
Topic Starter сообщение 12.1.2010, 18:09; Ответить: LordNighton
Сообщение #1


Проблема такова. Нужен скрипт, который при наведении на ссылку рядом с курсором показывал картинку небольшого размера. Когда наводим на другую ссылку, появляется другая картинка. При нажатии на ссылку мы переходим на другую страницу.

Заранее спасибо !
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
alexdrob
alexdrob
сообщение 12.1.2010, 18:34; Ответить: alexdrob
Сообщение #2


обсуждалось минут 10 назад)
http://www.html.by/showthread.php?t=9591
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
LordNighton
LordNighton
Topic Starter сообщение 12.1.2010, 23:29; Ответить: LordNighton
Сообщение #3


alexdrob,это не то, что мне нужно. В ссылке, указанной Вами был пример на счет того, чтобы показывать картинку лишь там, где она уже есть и спозиционирована. В моей же версии скрипта картинка должна появляться рядом с курсором.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
alexdrob
alexdrob
сообщение 12.1.2010, 23:47; Ответить: alexdrob
Сообщение #4


<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
</head>

<script>

function showImg(fn){
var el = document.getElementById('img');
if(fn) el.innerHTML = '<img src="' + fn + '" />'; else el.innerHTML ='&nbsp;';
}

function move(){
var el = document.getElementById('img');
el.style.top = event.y;
el.style.left = event.x;
}

</script>

<body>

<a href="#" onmouseover="showImg('http://html.by/images/icons/icon1.gif')" onmouseout="showImg('')" onmousemove="move()">??????</a>
<a href="#" onmouseover="showImg('http://html.by/images/icons/icon2.gif')" onmouseout="showImg('')" onmousemove="move()">??????</a>
<a href="#" onmouseover="showImg('http://html.by/images/icons/icon3.gif')" onmouseout="showImg('')" onmousemove="move()">??????</a>
<a href="#" onmouseover="showImg('http://html.by/images/icons/icon4.gif')" onmouseout="showImg('')" onmousemove="move()">??????</a>
<a href="#" onmouseover="showImg('http://html.by/images/icons/icon5.gif')" onmouseout="showImg('')" onmousemove="move()">??????</a>
<div id="img" style="position:absolute;"></div>

</body>
</html>

где картинка появится подгоняйте тут
el.style.top = event.y-20;
ell.style.left = event.x-20;
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
exponat
exponat
сообщение 13.9.2013, 18:31; Ответить: exponat
Сообщение #5


Полезный код!

Помогите мне пожалуйста.

У меня цикл при выводе новостей. Вот при наведении на них хочу чтоб отображалась превью фото и дескрипшенс новости.
У меня проблема вот в чем. Выше пример (где статически выводится изображение) реализовывается когда мы знаем точное количество ссылок и фото.
А если у меня цикл в котором выводится 70 ссылок в столбец:
[PHP]{
echo "<a class='link1' href='?action=news_inf&amp;id=".$result_news['id']."' onmouseover=\"showImg('img1','http://www.domain.ru/image/news/".$result_news['img']."')\" onmouseout=\"showImg('img1','')\"> &nbsp;".htmlspecialchars($result_news['title'], ENT_QUOTES)."<div id='img1'></div></a>";
}[/PHP]

В результате на какую бы я ссылку не навел - картинка выводится правильная но в возле первой ссылки! Потому что там стоит статичный img1. Как мне сделать чтоб к img приписывался в цикле свой номер?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
MetSerp
MetSerp
сообщение 13.9.2013, 18:54; Ответить: MetSerp
Сообщение #6


Смотря какой у вас цикл, если for то у вас наверняка уже есть итератор, его и приписывайте.
Если while или foreach то заведите итератор и просовывайте его, но мне кажется вы изначально немного кривовато начали реализовывать, с таким подходом вы намучаетесь.
вы используете jquery в проекте?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
exponat
exponat
сообщение 15.9.2013, 11:01; Ответить: exponat
Сообщение #7


Вот помогли с выводом для каждой ссылки с циклом:
тут без изменения
[JS]function showImg(id,fn){
var el = document.getElementById(id);
if(fn) el.innerHTML = '<img style="width:100px;" src="' + fn + '" />'; else el.innerHTML ='';
}[/JS]

А вот полный код с циклом:
[PHP]<?php $zapros_news = mysql_query("SELECT * FROM `news` ORDER BY `id` DESC LIMIT 70") or die(mysql_error());
echo "<table cellpadding='0' cellspacing='0' border='0' >";
$date1=0;
$i = 0;
while ($result_news = mysql_fetch_assoc($zapros_news))
{
$date = $result_news['date'];
if ($date!=$date1)
{
echo "<tr><td align='left' style='border-bottom:1px solid #666; padding-top:5px;padding-bottom:3px; '><b><font size='3'>".$date."</font></b></td><td style='border-bottom:1px solid #666;'></td></tr>";
}

echo "<tr><td align='left' style='border-bottom:1px dashed #CCCCCC; padding-top:3px; padding-bottom:3px;'><div style='margin-left:5px; margin-right:5px;'><font size='2'><span class='time_l'>&nbsp;".$result_news['time']." </span>";

{
echo "<a class='link1' href='?action=news_inf&id=".$result_news['id']."' onmouseover=\"showImg('img".++$i."','http://www.domain.ru/image/news/".$result_news['img']."')\"onmouseout=\"showImg('img".$i."','')\">&nbsp;".htmlspecialchars($result_news['title'], ENT_QUOTES)."<div id='img".$i."'></div></a>";
}

echo "</font></div></td></tr>";
$date1 = $result_news['date'];
}
echo "</table>";
?>[/PHP]

Оно работает. Но коряво - когда наводиш на ссылку - картинка выводится под ней, но курсором навести на картинку не получается. Она исчезает. Хочется чтоб она не исчезала под курсором. И как мне возле картинки вывести дескрипшенс новости? В БД дескрипшенс сохраняется в таблице news столбце descriptions.

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) "Извините, что ожидание затянулось, но не думайте, пожалуйста, что мы про вас забыли. Мы заводим задачи по всем обращениям и контролируем работу над ними самым тщательным образом."
Вопрос
0 kuz999 1246 5.2.2024, 14:06
автор: kuz999
Открытая тема (нет новых ответов) Размещу статью с ссылкой на ваш ресурс
Донор: ИКС : 38000, Page Rank = 5.94 (xPR), Траст = 10
6 Курыкин 3144 5.11.2023, 2:55
автор: AndrePro
Открытая тема (нет новых ответов) Площадки для статей с анкорной ссылкой
Бесплатная база
26 Retyk 15199 10.5.2020, 14:11
автор: Retyk
Открытая тема (нет новых ответов) Опубликую вашу статью с ссылкой бесплатно.
На своем блоге - ИКС - 90
0 Retyk 1392 7.9.2019, 18:30
автор: Retyk
Открытая тема (нет новых ответов) Бесплатно опубликуем статьи на сайте с ИКС 1500 с прямой ссылкой
0 Alex-777 1515 31.7.2019, 16:11
автор: Alex-777


 



RSS Текстовая версия Сейчас: 24.4.2024, 9:08
Дизайн