inex
-
Posts
59 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by inex
-
-
Точняк...не к тому элементу inline применил, спасибо.
-
Добрый день, столкнулся с вот такой штукой, вот допустим меню
<section class="menu">
<ul>
<li><a href="#">item1</a></li>
<li><a href="#">item2</a></li>
<li><a href="#">item3</a></li>
<li><a href="#">item4</a></li>
</ul>
</section>
.menu{
text-align: center;
overflow: hidden;
}
.menu ul{
display: inline-block;
}
.menu li{
float: left;
}
.menu li a{
display: block;
padding: 15px 35px;
}Всё выравнивается по центру как нужно, но у <ul> получается отступ снизу на пикселя 4.
margin:0 и padding:0 ничего не дают. Но если убрать inline-block у <ul> , то отступа нет, но отсюда другая проблема, тогда меню не выравнивается по центру... Как правильно реализовать?
Заранее спасибо!
-
alexriz, спасибо, то что нужно
-
Чёрный фон не катит...нужно фон #ececec а фигура #f7f7f7
-
Раньше не юзал фигуры, решил попробовать, ну тут какие-то грабли))
div {
width: 0;
height: 0;
border-top: 50px solid transparent;
border-right: 100px solid red;
border-bottom: 50px solid transparent;
}получается красный треугольничек, но мне надо цвет #F7F7F7, меняю, и о чудо, у треугольника появляется border, что за странность?
-
При использовании padding:15px 0; где?
-
А вообще, корректно ли использование одинаковых классов в разных подклассах, например
<div class="box1">
<a class="link"></a>
</div>
<div class="box2">
<a class="link"></a>
</div>
<div class="box3">
<a class="link"></a>
</div>
.box1 a.link{color:red}
.box2 a.link{...}
.box3 a.link{...}color применится только к ссылке внутри box1?или вот так будет лучше?
<div class="box1">
<a class="link1"></a>
</div>
<div class="box2">
<a class="link2"></a>
</div>
<div class="box3">
<a class="link3"></a>
</div> -
-
Сделай нормальный спрайт картинки.
-
Можно закрывать, проблема решена
-
Добрый день, вот есть меню, http://jsfiddle.net/NAyU8/2/ , при наведении внизу появляется подменю, как сделать так чтобы подменю при наведении появлялось, но не исчезало пока не наведёшь на другой пункт меню? Делал вот так http://jsfiddle.net/LPQDF/1/ ,но меню накладывается друг на друга...
Заранее спасибо!
-
Эх)) Ну будем ждать =(
-
Если ты имеешь ввиду "переключалки" 1 2 3 4, то вот их класс
.b-slider-nav li a {
display: inline-block;
//display: inline;
//zoom:1;
width: 146px;
height: 145px;
} -
Не проще, интересует можно ли применять opacity к определенному свойству css
-
К классу .dropdown добавте свойство z-index: 99999;
-
Добрый день, возникла вот такая проблемка:
Допустим есть вот такая конструкция
<input type="text" class="fade" name="login" id="login" />
input{
border:1px solid red;
color: #747474;
background: url('image.png') no-repeat;
}
$(function() {
$(".fade").css("opacity", "1");
$(".fade").hover(function () {
$(this).stop().fadeTo(300, 0.65);
},
function () {
$(this).stop().fadeTo(300, 1);
});
});Прозрачность в итоге применяется ко всем свойствам(border,color,background) , можно ли как-то применить opacity только к backgroud?
Заранее спасибо!
-
Как можно обойтись без display:inline? Запарился уже с этим меню...
Если использовать display:block то подменю появляется слева, а не под элементом на который навел(как мне и нужно)... С inline нормально не застилизовать
-
Ну с эффектами то симпотишнее) Спасибо!
Блин, теперь новая непонятка, вот
http://jsfiddle.net/kamaz6141/zt3QY/2/
расстояния между блоками, а если добавить float:left для li, то вот что выходит
http://jsfiddle.net/kamaz6141/zt3QY/3/
-
Зачем тут appendTo()?
С минимальной стилизацией и модификацией существующего решения я могу предложить такой код.
изначально так и делал, но у меня почему-то подменю не с начала второй строки появляется, а под тем элементом на который наводишь...поэтому начал прикручивать appendTo
-
Добрый день вот мое меню
<nav id="topmenu">
<ul>
<li><a class="menu-link">Главная</a></li>
<li><a class="menu-link">Новости</a>
<ul class="drop-bottom">
<li><a>Спорт</a></li>
<li><a>Бизнес</a></li>
<li><a>Город</a></li>
</ul>
</li>
<li><a class="menu-link">Статьи</a>
<ul class="drop-bottom">
<li><a>Спорт</a></li>
<li><a>Бизнес</a></li>
<li><a>Природа</a></li>
<li><a>Достижения</a></li>
<li><a>Город</a></li>
</ul>
</li>
<li><a class="menu-link">О нас</a></li>
<li><a class="menu-link">Связь</a></li>
</ul>
</nav>
$(document).ready(function() {
$('#topmenu ul li').hover(
function(){
$(this).find('.drop-bottom').appendTo('#topmenu').fadeIn();
},function(){
$(this).find('.drop-bottom').fadeOut();
}
);
});Ховер срабатывает только при наведении, когда убираешь курсор то .drop-bottom не исчезает...что делаю не так?
-
Да внутри, спасибо, всё стало нормально! .find() это как бы поиск среди дочерних элементов?
-
Добрый день, Понадобилось что-бы при наведении на
<div class='block'></div>
появлялся
<div class='drop'></div>
, написал, но возникла проблема, таких блоков на странице допустим 10, и при наведении на любой из них, блок с классом drop появляется сразу у всех элементов с классом block, а не у того на который навёл...как заставить скрипт срабатывать только на блоке на который навёл?
Сории за кашу, даже не знаю как описать проблему, заранее спасибо!
$('.block').hover(
function() {
$('.drop').show();
},function(){
$('.drop').hide();
}
); -
Страница сначала загружает весь сайт а потом включается заглушка, а надо чтобы грузилась только заглушка для ie и всё.
-
Добрый вечер, имеется вот такой код
/* noie */
jQuery(document).ready(function($){
var abc = "body";
jQuery.each(jQuery.browser, function(i) {
if($.browser.msie && $.browser.version < 9){
$("#page").replaceWith('<div id="noie"><span></span><h2>К сожалению ваш браузер устарел!</h2><div style="clear: both;"></div><p>Установите более современный!</p></div>');
}
});
});
/* slider */
jQuery(document).ready(function($){
$("#showcase").awShowcase(
{
content_width: 514,
content_height: 280,
fit_to_parent: false,
auto: true,
interval: 3000,
continuous: true,
loading: true,
tooltip_width: 200,
tooltip_icon_width: 32,
tooltip_icon_height: 32,
tooltip_offsetx: 18,
tooltip_offsety: 0,
arrows: false,
buttons: true,
btn_numbers: false,
keybord_keys: true,
mousetrace: false, /* Trace x and y coordinates for the mouse */
pauseonover: true,
stoponclick: false,
transition: 'fade', /* hslide/vslide/fade */
transition_delay: 0,
transition_speed: 500,
show_caption: 'onload', /* onload/onhover/show */
thumbnails: false,
thumbnails_position: 'outside-last', /* outside-last/outside-first/inside-last/inside-first */
thumbnails_direction: 'vertical', /* vertical/horizontal */
thumbnails_slidex: 1, /* 0 = auto / 1 = slide one thumbnail / 2 = slide two thumbnails / etc. */
dynamic_height: false, /* For dynamic height to work in webkit you need to set the width and height of images in the source. Usually works to only set the dimension of the first slide in the showcase. */
speed_change: true, /* Set to true to prevent users from swithing more then one slide at once. */
viewline: false, /* If set to true content_width, thumbnails, transition and dynamic_height will be disabled. As for dynamic height you need to set the width and height of images in the source. */
custom_function: null /* Define a custom function that runs on content change */
});
});
/* modal */
jQuery(document).ready(function($){
$( "#logindialog" ).dialog({
autoOpen: false,
wight: 100
});
$('#loginlink').click(function(){
$('#logindialog').dialog('open');
return false;
});
});
/* menu */
jQuery(document).ready(function($){
$('ul.menu').each(function(){
// find menu items with children.
$(this).find('li').has('ul').addClass('has-menu')
//.append('<span class="arrow"> </span>');
});
$('ul.menu li').hover(function(){
$(this).find('ul:first').stop(true, true).fadeIn('fast');
$(this).addClass('hover');
},
function(){
$(this).find('ul').stop(true, true).fadeOut('slow');
$(this).removeClass('hover');
});
});Как остановить выполнение функций после
/* noie */
jQuery(document).ready(function($){
var abc = "body";
jQuery.each(jQuery.browser, function(i) {
if($.browser.msie && $.browser.version < 9){
$("#page").replaceWith('<div id="noie"><span></span><h2>К сожалению ваш браузер устарел!</h2><div style="clear: both;"></div><p>Установите более современный!</p></div>');
}
});
});? , чтобы только он выполнился на странице, заранее спасибо!
Слайдер с ресайзом
in HTML Coding
Posted
Добрый день, посоветуйте какой-нибудь слайдер изображений с ресайзом... На сайте изображения с большим разрешением, и в слайдере только кусок показывается, вот и ищу слайдер который ресайзил и кропал изображение под размер слайдера.
Заранее спасибо!