Увеличение текста при наведении

Статус
В этой теме нельзя размещать новые ответы.
sidor

sidor

Старатель
Регистрация
7 Июн 2006
Сообщения
220
Реакции
14
Ребята, вообщем, есть у меня листинг страниц внизу "1 2 3 4 5 6 ..." определенного размера. Мне нужно что бы при наведении на цифру, она увеличивалась, но при этом ничего не смещалось вниз или вверх. Я пробовал через a:hover, но тогда футер при наведении пригает и сдвигается вниз, а мне нужно что бы цифра просто увеличилась вверх (padding-top вверх делать пробовал, но ничего не получается все-равно). Посоветуйте решение пожалуйста.
 
мдя, задачка с виду простая а в деле голову пришлось ломать...
чисто дивами не вышло, пришлось применить таблицу, думаю в этом нет ничо плохого ведь это поле навигации индексировать поисковиком не нужно )
Код: 
<head>
<style>
#nav {background:#dadada; text-align:center; height:70px;}
#nav td {padding:20px 20px 23px 20px;}
#nav a {border:1px solid silver; background:white; color:#000000; font-size:10px; font-family:verdana; text-decoration:none; padding:10px; margin:5px;}
#nav a:hover {margin-top:0px; width:10px; height:10px; font-size:18px; padding:2px 8px 8px 8px; margin:5px;}
</style>
</head>
<body>
<table id="nav"><br style="clear:both;"><tr><td valign="bottom">
<a href="#">1</a>
<a href="#">2</a>
<a href="#">3</a>
<a href="#">4</a>
<a href="#">5</a>
</td></tr></table>
</body>

код корявенький, может кто улучшит)
в IE6 смотрится ужасно, буду думать дальше...
 
просто где постраничная нафигация слою задается высота допустим в 25 пикселей и все
 
не пробовал, но в голову приходит вариант с лайн-хейт поиграть. Должно сработать, если только вертикальная сдвижка смущает.
 
sidor написал(а):
Ребята, вообщем, есть у меня листинг страниц внизу "1 2 3 4 5 6 ..." определенного размера. Мне нужно что бы при наведении на цифру, она увеличивалась, но при этом ничего не смещалось вниз или вверх. Я пробовал через a:hover, но тогда футер при наведении пригает и сдвигается вниз, а мне нужно что бы цифра просто увеличилась вверх (padding-top вверх делать пробовал, но ничего не получается все-равно). Посоветуйте решение пожалуйста.
Нажмите для раскрытия...
Вариант - этот листинг страниц ("1 2 3 4 5 6 ...") просто в отдельный div засунуть с фиксированной высотой. Можно еще overflow:hidden приписать.
 
как вариант:
a{
font-size: xpx;
padding: ypx 0;
}
a:hover{
font-size:(x+z)px;
padding:(y-(z/2))px 0;
}

вместо переменных и выражений выделенных красным вставь числовые значения)
а вобще имхо ролловеры типа увелечения шрифта, толщины шрифта - отстой, ибо када наводиш на одну ссылку скачет вся меню, без, к примеру, таких танцев с бубном. да и не красиво просто. цвет, подчеркивание там - нормально. но эт опять же личное дело каждого
 
.nav a { font-size: 12px; line-height: 20px; }
.nav a:hover { font-size: 15px; }
 
Dewars
лайн хеигхт я пробовал изначально, ничего не получилось !
 
dralex, попробуй так
.nav a { font-size: 12px; line-height: 20px; }
.nav a:hover { font-size: 15px; line-height: 20px; }
Нажмите для раскрытия...

если не заработает - подучи html и css..
 
Dewars, не заработало, щас подучу хтмл и цсс, а мог бы ты на нашем примере показать свою идею ? ну внедрить свой вариант в выше указанный мною код..
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху