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



 

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

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

Открыть тему
Тема закрыта
> Помогите закруглить углы.
Flashton
Flashton
Topic Starter сообщение 16.2.2010, 22:00; Ответить: Flashton
Сообщение #1


Использую плагин для jQuery, который выводит подсказку, когда курсор подводиться к ссылке. Так вот у этой подсказки углы закруглены с помощью свойств moz-border, работает это только в Mozilla Firefox, а Opera и Internet Explorer, это свойство воспринимать не хотят. В этом заключается вся проблема.
Кто знает, как сделать закруглённые углы в данной ситуации?
CSS:

[FONT=Trebuchet MS]p#vtip
{
display: none;
font-family:Arial, Helvetica, sans-serif;
position: absolute;
padding: 10px;
left: 5px;
font-size: 0.8em;
background-color: white;
border: 1px solid #a6c9e2;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
z-index: 9999
}

p#vtip #vtipArrow
{
position: absolute;
top: -10px;
left: 5px
}[/FONT]


HTML:
<link rel="stylesheet" type="text/css" href="CSS/pdp_style.css">
<script type="text/javascript" src="JS/jquery.js"></script>
<script type="text/javascript" src="JS/vtip.js"></script>
<a class="vtip" title="Текст подсказки" href="index.html">Имя страницы</a>



JS:
[FONT=Trebuchet MS]
this.vtip = function() {    
    this.xOffset = -10; // x distance from mouse
    this.yOffset = 10; // y distance from mouse      
    
    $(".vtip").unbind().hover(    
        function(e) {
            this.t = this.title;
            this.title = '';
            this.top = (e.pageY + yOffset); this.left = (e.pageX + xOffset);
            
            $('body').append( '<p id="vtip"><img id="vtipArrow" />' + this.t + '</p>' );
                        
            $('p#vtip #vtipArrow').attr("src", 'Images/Slujebnie/vtip_arrow.png');
            $('p#vtip').css("top", this.top+"px").css("left", this.left+"px").fadeIn("slow");
            
        },
        function() {
            this.title = this.t;
            $("p#vtip").fadeOut("slow").remove();
        }
    ).mousemove(
        function(e) {
            this.top = (e.pageY + yOffset);
            this.left = (e.pageX + xOffset);
                        
            $("p#vtip").css("top", this.top+"px").css("left", this.left+"px");
        }
    );            
    
};

jQuery(document).ready(function($){vtip();})
[/FONT]


this.vtip=function(){this.xOffset=-10;this.yOffset=10;$(".vtip").unbind().hover(function(a){this.t=this.title;this.title="";this.top=(a.pageY+yOffset);this.left=(a.pageX+xOffset);$("body").append('<p id="vtip"><img id="vtipArrow" />'+this.t+"</p>");$("p#vtip #vtipArrow").attr("src","Images/Slujebnie/vtip_arrow.png");$("p#vtip").css("top",this.top+"px").css("left",this.left+"px").fadeIn("slow")},function(){this.title=this.t;$("p#vtip").fadeOut("slow").remove()}).mousemove(function(a){this.top=(a.pageY+yOffset);this.left=(a.pageX+xOffset);$("p#vtip").css("top",this.top+"px").css("left",this.left+"px")})};jQuery(document).ready(function(a){vtip()});
--------------------------------------------
С уважением, Антон.
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Htmlmaster
Htmlmaster
сообщение 16.2.2010, 22:04; Ответить: Htmlmaster
Сообщение #2


есть замечательный сайт http://habrahabr.ru/blogs/webdev/30019/ - в нём находится аж 38 статей по закруглению углов
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Flashton
Flashton
Topic Starter сообщение 16.2.2010, 22:16; Ответить: Flashton
Сообщение #3


Спасибо за внимание к теме. Эти статьи я уже читал, они конечно хороши, но, не мой случай. В этих статьях говорят про закругление углов у блока, а я, как я понял, закругляю углы не у блока, в этом вся сложность.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
sikwel_hb
sikwel_hb
сообщение 17.2.2010, 12:17; Ответить: sikwel_hb
Сообщение #4


действительно не у блока а у блочного элемента параграф "p" о чем говорит ваш CSS код, а в HTML у вас почему-то ссылка да еще и с классом вместо айдишника, который у вас в CSS
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
TiGrann
TiGrann
сообщение 25.2.2010, 19:01; Ответить: TiGrann
Сообщение #5


Помогите пожалуйста закруглить углы в блоке! Закруглял с помощью 4 картинок и фона, но IE криво открывает, в Firefox все ровно. Может можно как то по другому? Вот код:
CSS.
html,body{margin:0;padding:0}

body{font: 76% arial,sans-serif;text-align:center;}

p{margin:0 10px 10px}

div#header h1{height:108px;
line-height:80px;margin:0;
padding-left:10px;
background: url(lg.gif) no-repeat;
color: #79B30B}

div#container{text-align:justify}
div#container{width:1210px;margin:0 auto}
div#nav {margin:-19 0 auto;
background: #ececec;
color: #f00;
font-size: 120%;
font-weight: bold;
line-height: 1.8em;
text-align: center;
}

div#nav ul {
list-style-type: none;
}

div#nav li {
display: inline;
margin: 0 8px:
}

div#nav li a {
color: #000;
}

div#nav li a:hover {
color: #f00;
}

a {
text-decoration: none;
}

div#wrapper{margin: -10 auto;
background:url(fon.gif) ;
float:left;width:100%}

div#content p{line-height:1.4}
div#content{margin: -20px 155px 5px 155px;height:600px; background:#ececec}

div#navigation{margin:0px auto;
background:#ecf1f3}

div#navigation{float:left;width:150px;height:600px;margin-left:-1203px}

div#navigation ul{list-style-type:none;
}


div#navigation li a{color: #000;
}

div#navigation li a:hover{color: #f00;
}
div#extra{margin:0 auto 5px;
background:#ecf1f3}
div#extra{float:left;width:150px;height:600px;margin-left:-157px;color: #665;}
div#extra h3 {
color: #f60;
font-size: 120%;
font-weight: bold;
text-align: center;
}

div#footer{background: #333;color: #FFF}
div#footer p{margin:0px o;padding:5px 10px}
div#footer{clear:left;width:100%}

Вот код html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>PODRUGA.ru</title>
<link rel="stylesheet" href="CSS/f.css" type="text/css" />
</head>
<bogy>
<div id="container">
<div id="header"><h1></h1></div>
<div id="nav">
<ul>
<li>Главная</li>
<li><a href="about.html">О нас</a></li>
<li><a href="http://forum/phpBB-3.0.6-ru/phpBB3/">Форум</a></li>
<li><a href="#">Стихотворение недели</a></li>
<li><a href="#">Подружиться</a></li>
</ul>
</div>
<div id="wrapper"><img src="CSS/kr.gif" align="top"/><!--картинка левого верхнего угла-->
<img src="CSS/kr2.gif" align="right" valign="top"/><!--картинка верхнего правого угла-->
<div id="content">
<p>КОНТЕНТ....................</p>
</div>
</div>
<div id="navigation">
<p><strong><br>
<ul>
<li><a href="#">Психолог</a></li>
<li><a href="#">Астролог</a></li>
</ul> </p>
</div>
<div id="extra"><br>
<p><strong><h3>НОВОСТИ</h3></p>
</div>
<img src="CSS/krd.gif" align="right" valign="bottom"/><!--картинка нижнего левого угла-->
<div id="footer"><p> footer</p></div>
</div>
</body>
</html>

Закруглить хочу углы блока "wrapper".............
получается вот так (в IE):
закруглить хочу синюю область, но картинки криво становятся. Как можно поправить?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
SEVI
SEVI
сообщение 25.2.2010, 20:07; Ответить: SEVI
Сообщение #6


Поищи сдесь evgeniypopov.com или тут ruseller.com
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
TiGrann
TiGrann
сообщение 25.2.2010, 22:33; Ответить: TiGrann
Сообщение #7


Да я смотрел....но не найти подходящий случай. Не знаю как все это подровнять. А может есть другой способ?

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


Свернуть

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

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Помогите вспомнить рекламного бота Телеграм для обмена рекламой
0 Mixatraider 732 21.2.2024, 23:42
автор: Mixatraider
Открытая тема (нет новых ответов) Помогите рещить проблему с монитором.
Почему низкое разрешение при подключении монитора через displayport?
0 Levels 1702 11.12.2020, 0:48
автор: Levels
Открытая тема (нет новых ответов) Помогите кто нибудь получить партнерку Росбанк!
7 heisenberg_mw 2345 7.8.2020, 9:28
автор: heisenberg_mw
Открытая тема (нет новых ответов) Помогите найти тему пожалуйста
7 virtas 12550 24.7.2020, 17:02
автор: -JamesSmips-
Открытая тема (нет новых ответов) Помогите с поиском доноров
3 tehno_music 3362 4.11.2019, 17:15
автор: goblin78


 



RSS Текстовая версия Сейчас: 25.4.2024, 13:57
Дизайн