Корректная работа меню Iphone 4

(Ответов: 1, Просмотров: 555)
  1. Новичок
    • Регистрация: 30.01.2014
    • Сообщений: 1
    • Репутация: 0
    Добрый вечер! Столкнулся с проблемой работы меню на Iphone.Имеется сайт остров-chang.ru, на ноуте и во всех браузерах все работает корректно, более-менее.На Iphone же при нажатие на пункт меню в который вложен подпункты, ничего не происходит. Я как понимаю вся причина в атрибуте hover:, который на тачевых экранах ведет себя эдаким способом, НО вот КАК ЭТО исправить Никак НЕ понимаю.Подскажите информация Пожалуйста
    Вот кусочек Кода, не судите строго , я в процессе изучения
    Код:
    .top_menu {
    	background: #009B97 url(../images/menu_back_1000.jpg) no-repeat;
    	width: 1000px;
    	padding: 10px 0 0;
    	float:left;
    	line-height: 1.4em;
    	
    		
    }
    
    .top_menu .rawmod {
    	padding: 0 9px;
    }
    
    .top_menu ul.menu
    {
    	display: table-row;
    	height: 39px;
    }
    
    .top_menu ul.menu li
     {
    	width: auto;
    	display: table-cell;
    	text-align: center;
    	height: 38px;
    	padding-left: 6px;
    	padding-top: 5px;
    	letter-spacing: 1px;
    	}
    	
    
    .top_menu ul.menu li a{
    background: #FFF;
    	width: 1000px;
    	height: 38px;
    	display: table-cell;
    	vertical-align: middle;
    	color: #056F6C;
    	text-decoration: none;
    	font-size: 18px;
    	padding-top: 2px;
    	text-transform: uppercase;
    }
    
    .top_menu ul.menu li:first-child
    {
    	padding-left: 0;
    }
    
    
    .top_menu ul.menu_mid li a:hover
    {
        background: #8EACBD;
    	color: #FFF;
    }
    .top_menu ul.menu li a:hover{
       background: #8EACBD;
    	color: #FFF;
    }
    
    .top_menu ul.menu li.active a,
    .top_menu ul.menu_mid li.active a {
    	background: #FFED00;
    	color: #FFF;
    }
    
    .top_menu .rawmod_sub {
    	padding: 0 100px;
    	
    }
    
    /* MENU_MID */
    
    .top_menu ul.menu_mid {
    
    	display: table-row;
    	height: 39px;
    	
    }
    
    
    .top_menu ul.menu_mid li {
    	width: auto;
    	display: table-cell;
    	text-align: center;
    	height: 38px;
    	padding-left: 4px;
    	letter-spacing: 1px;
    }
    
    .top_menu ul.menu_mid li:first-child {
    	padding-left: 0;
    }
    
    .top_menu ul.menu_mid li a {
    	background: #FFF;
    	width: 1000px;
    	height: 38px;
    	display: table-cell;
    	vertical-align: middle;
    	color: #056F6C;
    	text-decoration: none;
    	font-size: 18px;
    	text-transform: uppercase;
    }
    
    .rawmod_mid {
    	margin-top: 5px;
    }
    
    
    .rawmod_mid_mid {
    	width: 742px;
    	float: left;
    }
    
    
    
    .top_menu hr {
    	margin-top: 16px;
    }
    
    
    
    .menu_mid li:hover ul li a{
    color:#FFF;
    height:40px;
    
    
    }
    
    .menu  li:hover ul li a
    {
    padding-left: 0;
    color:#FFF;
    height:38px;
    }
    
    .menu  li:hover ul li a:hover {
    color:#272533;
    background:#8EACBD!important;
    }
    
    ul.menu_mid li:hover ul li a:hover{
    color:#272533;
    background:#8EACBD!important;
    }
    
    ul.menu ul li {
    	float: left;
    }
    
    ul.menu_mid ul li a{
    background: #445C67 !important;
    }
    
    ul.menu ul li a {
    	background: #445C67 !important;
    }
    .menu ul ,
    .menu_mid ul {
        display:none;
    	position: absolute;
    	padding:0;
    	z-index:000;
    	width: 500px;
    } 
    ul.menu li:hover ul  {
    	display:block;
       
    }
    
    ul.menu_mid li:hover ul {
    	padding-top:5px;
    	display:block; 
    	width: 500px;
     }
    
    
     /* об острове */
    ul.menu li.item-491,
    ul.menu li.item-492,
    ul.menu li.item-493,
    ul.menu li.item-494,
    ul.menu li.item-495,
    ul.menu li.item-496,
    ul.menu li.item-497 {
    	position:absolute;
    	}
    ul.menu li.item-491{
        margin-left:120px;
    	width: 248px;
    }ul.menu li.item-492{
        margin-left:365px;
    	width: 260px;}
    ul.menu li.item-493{
        margin-left:629px;
    	width: 227px;}
    ul.menu li.item-494{
        margin-left: -6px;
        margin-top: 43px;
        width: 249px;}
    ul.menu li.item-495{
    margin-top: 43px;
        margin-left:247px;
    	width: 263px;}
    ul.menu li.item-496{
    margin-left: 515px;
        margin-top: 43px;
        width: 213px;}
    ul.menu li.item-497{
    margin-top:43px ;
        margin-left:732px;
    	width: 244px;}
    • 0
  2. Опытный Аватар для dik85
    • Регистрация: 25.03.2011
    • Сообщений: 297
    • Репутация: 47
    • Webmoney BL: ?
    Думаю дело всё в том что ваш шаблон не адоптирован к мобильным устройствам, и для того чтобы это сделать нужно хорошо понимать что и как править. Вот нашел статью которая быть может вам поможет сделать сайт мобильным без особых изменений в файлах _http://joomlablog.ru/prijomy-poleznye-tryuki/67-rukovodstvo-po-nastrojke-mobile-joomla
    • 0

Похожие темы

Темы Раздел Ответов Последний пост
Корректная установка шаблона в Prestashop v.1.4.x
Web программирование 1 22.04.2012 23:42
Вид меню категорий Virtuemart нужно заменить на вид меню Joomla
Вопросы от новичков 2 21.11.2011 21:31
Работа на форуме через iPhone и iPad
Обсуждение форума и ваши предложения 9 28.08.2011 22:24
Корректная работа Platinum Seo Pack (плагин WP)
Web программирование 3 08.07.2011 11:09

У кого попросить инвайт?

Вы можете попросить инвайт у любого модератора:

Информеры