Jump to content
  • 0

Эффект перекатывания


Noks
 Share

Question

доброво времени суток, я только недавно стал изучать css и хотел на своем сайте применить эффект перекатывания(с помощью скрипта который я нашел на этом сайте),все работает только у меняпоблема у меня рисунки кнопок в jpeg и когда я первожу их в gif то ухудшается качество,а если ставить jpeg то браузер не отображает картинку;)

Вот скрипт:

<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=windows-1251">

<title>Эффект перекатывания</title>

<style type="text/css">

A.rollover {

background: url('1.gif'); /* Путь к файлу с исходным рисунком */

display: block; /* Рисунок как блочный элемент */

width: 196px; /* Ширина рисунка */

height: 183px; /* Высота рисунка */

border: 1px solid #000; /* Рамка вокруг картинки */

}

A.rollover:hover {

background: url('2.gif'); /* Путь к файлу с заменяемым рисунком */

}

</style>

</head>

<body>

<p><a href="#" class="rollover"> </a></p>

</body>

</html>

Link to comment
Share on other sites

8 answers to this question

Recommended Posts

  • 0

проверяйте, правильно ли вы прописываете пути к файлам и имена файлов. jpeg, jpg и JPG - это разные расширения. и если у вас картинка сохранена как JPG, а вы пишете jpg, браузер ее не увидит.

Link to comment
Share on other sites

  • 0

Вдогонку: во многих случаях полезно объединять обе картинки в одном файле и показывать нужный кусок, меняя background-position. Это экономит запросы к серверу и устраняет "моргание" картинок при первом наведении.

Link to comment
Share on other sites

  • 0
Вдогонку: во многих случаях полезно объединять обе картинки в одном файле и показывать нужный кусок, меняя background-position. Это экономит запросы к серверу и устраняет "моргание" картинок при первом наведении.

вдогонку догонке ;)

или js-ом прелоад реализовывать, чтоб не моргало. но мне удобней вариант с объединением.

Link to comment
Share on other sites

  • 0

Спасибо,разоьрался я вместо разрешения jpg писал jpeg,

теперь рисунок объединил в один

Только теперь у меня другая проблема весь css я сохранил в buttons.css и подключил в html через функцию

<link rel="stylesheet" type="text/css" href="buttons.css" >(все работает)

потом я переместил buttons.css в папку css и прописал так

<link rel="stylesheet" type="text/css" href="css/buttons.css" >

но картинки не распознаются:rolleyes:

Link to comment
Share on other sites

  • 0

Вот у меня еще поблема(скрул не меняется:(

вот подключение файла:

<link rel="stylesheet" type="text/css" href="css/scroll.css">

вот сам файл

<body style="scrollbar-3d-light-color: blue;

scrollbar-arrow-color: gray;

scrollbar-base-color: black;

scrollbar-face-color: black;

scrollbar-highlight-color: gray;

scrollbar-shadow-color: gray;

scrollbar-track-color: black;">

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy