У вас есть два варианта сделать что-то подобное:
В своей веб-части списка вы показываете свои URL-адреса, как уже сделали, но вы также создаете div для своего описания, вы просто скрываете их. Их, при наведении курсора, вы показываете информацию, используя jQuery (jQuery Tools Overlay или Tooltip или что-то вроде этого)
Если у вас большое описание или в вашем списке много элементов, вы можете использовать для этого веб-службу списка AJAX / SharePoint. Это немного сложнее, но, возможно, оно того стоит.
Подробнее об этом методе можно узнать здесь
EDIT:
Вы можете использовать jQuery, чтобы показать ваш div очень легко. Добавьте в код следующую разметку:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a').hover(
function () {
$('#divDescription').show();
},
function () {
$('#divDescription').hide();
}
);
});
Прочитайте некоторые учебники о том, как начать работу с jQuery .
РЕДАКТИРОВАТЬ 2:
Я предполагаю, что у вас есть разметка, как это:
<div>
<a>Your First link</a>
<div id="divDescription">Your First Description</div>
</div>
<div>
<a>Your Second link</a>
<div id="divDescription">Your SecondDescription</div>
</div>
...
Вместо этого вы должны сделать что-то вроде:
<div>
<a>Your First link</a>
<div class="description">Your First Description</div>
</div>
<div>
<a>Your Second link</a>
<div class="description">Your SecondDescription</div>
</div>
...
Обратите внимание, как я использую класс вместо идентификатора для описания div.
Тогда в вашем javascript:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a').hover(
function () {
$(this).parent('div').find('.description').show();
},
function () {
$(this).parent('div').find('.description').hide();
}
);
});
Вам нужно понять, что вы делаете с jQuery, чтобы сделать эту работу. Когда вы делаете $("#divDescription").show();
, вы выбираете все div с идентификатором "divDescription" и показывает их. Узнайте больше о функциях parent и find . Я действительно рекомендую вам ознакомиться с javascript и jQuery, чтобы лучше понять, как это работает. В Интернете есть множество учебников, которые помогут вам в этом.