Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как сделать чтобы не закрывать актиыный див при открытии другого дива (https://javascript.ru/forum/misc/30948-kak-sdelat-chtoby-ne-zakryvat-aktiynyjj-div-pri-otkrytii-drugogo-diva.html)

dimas15 21.08.2012 17:40
Как сделать чтобы не закрывать актиыный див при открытии другого дива
 
// Когда страница полностью загружена
$(window).ready(function()
{
// запоминаем высоту и отступы каждого блока
$('#accordion > div').each(function()
{
$(this).data('height', $(this).height());
$(this).data('padding-top', $(this).css('padding-top'));
$(this).data('padding-bottom', $(this).css('padding-bottom'));
});

// Скрываем все секции кроме первой
$('#accordion > div:not(:first)').hide();
// Делаем первую секцию активной
$('#accordion h3:first, #accordion div:first').addClass('active');
// Если пользователь кликнул на секцию
$('#accordion > h3').click(function()
{
// Сбрасываем все секции
$('#accordion > h3').removeClass('active');
$('#accordion > div:visible').animate({height: 0, 'padding-top': 0, 'padding-bottom': 0}, 500, function() { $(this).hide() } );

// Делаем активной на которую кликнули
$(this).addClass('active');
box = $(this).next().addClass('active');
$(box).animate(
{
height: $(box).data('height'),
'padding-top': $(box).data('padding-top'),
'padding-bottom': $(box).data('padding-bottom')
}, 500);
});
});

lord2kim 21.08.2012 18:55
dimas15, предположим нужно закоментить эту строку
// Сбрасываем все секции
//$('#accordion > h3').removeClass('active');

но в таком случае все секции будут оставаться открытыми...

dimas15 21.08.2012 19:12
а как сделать чтобы при нажатии открывалась секция , а при втором нажатии закрывалась?

lord2kim 21.08.2012 19:37
dimas15, предположительно так
// Когда страница полностью загружена
$(window).ready(function()
{
// запоминаем высоту и отступы каждого блока
$('#accordion > div').each(function()
{
$(this).data('height', $(this).height());
$(this).data('padding-top', $(this).css('padding-top'));
$(this).data('padding-bottom', $(this).css('padding-bottom'));
});

// Скрываем все секции кроме первой
$('#accordion > div:not(:first)').hide();
// Делаем первую секцию активной
$('#accordion h3:first, #accordion div:first').addClass('active');
// Если пользователь кликнул на секцию
$('#accordion > h3').click(function()
{
// Сбрасываем все секции
if ($(this).hasClass('active')) {
$(this).removeClass('active');
$('#accordion > div:visible').animate({height: 0, 'padding-top': 0, 'padding-bottom': 0}, 500, function() { $(this).hide() } );
}
else {
// Делаем активной на которую кликнули
$(this).addClass('active');
box = $(this).next().addClass('active');
$(box).animate(
{
height: $(box).data('height'),
'padding-top': $(box).data('padding-top'),
'padding-bottom': $(box).data('padding-bottom')
}, 500);
}
});
});

dimas15 21.08.2012 19:40
lord2kim,
а как сделать чтобы при нажатии открывалась секция , а при втором нажатии закрывалась?

lord2kim 21.08.2012 19:42
dimas15, пост 4 не?

dimas15 21.08.2012 19:44
нужно чтобы при клике открывалась секция а ,предыдущая не закрывалась. т е чтобы можно было открыть все секции и при желании закрыть любую при клике.

dimas15 21.08.2012 19:46
можно чтобы все секции были скрыты изначально.

lord2kim 21.08.2012 19:48
Цитата:
Сообщение от dimas15 (Сообщение 199410)
можно чтобы все секции были скрыты изначально.
 
// Скрываем все секции кроме первой
$('#accordion > div').hide();

dimas15 21.08.2012 19:50
да, я это комментил.

dimas15 21.08.2012 19:52
сейчас ситуация такая что при открытии второй секции первая закрывается автоматически, а она должна закрываться при клике...(

lord2kim 21.08.2012 19:57
dimas15, выложите готовый пример, например, здесь -> http://jsfiddle.net/

dimas15 21.08.2012 19:58
lord2kim,
Изначально чтобы все секции были закрыты.
нужно чтобы при клике открывалась секция, а предыдущая не закрывалась. т е чтобы можно было открыть все секции и при желании закрыть любую при клике.

dimas15 21.08.2012 20:00
lord2kim,
я могу архивом скинуть на мыло ?

dimas15 21.08.2012 20:02
lord2kim,
http://jsfiddle.net/7NuhN/

dimas15 21.08.2012 20:02
Deff,
http://jsfiddle.net/7NuhN/

Deff 21.08.2012 20:38
dimas15,
А по чему там кликать ?

Листогибочное оборудование ? - Дык там вродь только одна вкладка ?

dimas15 21.08.2012 20:45
Deff,
В смысле чтобы событие не происходило свернуть развернуть а просто оставалось название заголовка.

Deff 21.08.2012 20:48
dimas15,
Еще раз!
1. Заголовки Оставляем Все ?
2. Кликаем оно разворачиваецо - не сворачивая остальные ?

В Опере сейчас так - изначально

Это - правильно ?

dimas15 21.08.2012 20:51
Deff,
да все верно. токо вместо развернуть свернуть про заголовок например Листогибочное оборудование и т.п.
и стиль можно прежним оставить если можно.
заранее спасибо

dimas15 21.08.2012 20:55
Deff, и чуть не забыл первый сектор можно не оставлять активным а в свернутом состоянии чтобы было изначально.

dimas15 21.08.2012 21:15
Deff,
жду ответа.

Deff 21.08.2012 21:35
dimas15,
<!DOCTYPE html>
  <html>
    <head>
      <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      <title> - jsFiddle demo</title>
      <script type="text/javascript" src="/js/lib/mootools-core-1.4.5-nocompat.js"></script>
      <link rel="stylesheet" type="text/css" href="/css/normalize.css">
      <link rel="stylesheet" type="text/css" href="/css/result-light.css">
      <style type="text/css">
    #wrap { width: 100%; margin: 200px auto; }
#accordion h3.head
{   
    border:1px solid #E0E0E0;
    margin: 4px 0 -2px 0; padding: 5px 10px;
    clear: left;
    color: #A52A2A;
    font-size: 20px;
    font-weight:normal;
    padding:0px;
    text-align: center;
    cursor: pointer;
    
    border-radius: 3px;
    -o-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    
    /*text-shadow: 1px 1px 0px #000;
    -o-text-shadow: 1px 1px 0px #000;
    -moz-text-shadow: 1px 1px 0px #000;
    -webkit-text-shadow: 1px 1px 0px #000;*/
}

#accordion h3.active
{
    background: #CCCCCC; 
}

#accordion div.big_blocks
{
    padding: 10px; margin: 0;

    border-radius: 3px;
    -o-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;    
      box-shadow: 3px 1px 4px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.1) inset;
 /* background: none repeat scroll 0 0 #EFEFEF;*/

    float: left;
    margin: 5px 5px 5px 0;
     padding: 10px 0 20px 20px;
    width: 98%;
}

  #accordion div.big_blocks ul{/*стиль li наследуется стандартно*/
font-size: 15px;
margin-left: 100px; 
text-align: left;
margin-top: 13px;
}
#accordion div.big_blocks ul span{
color: #005058;
    font-size: 17px;
    margin-left: -31px;
}
#accordion div.big_blocks ul li{
line-height:-0.7pxpx;
}
#accordion div.blocks_littles{
     float: left;
    height: 187px;
    margin: 10px 10px 0px 0;
    padding: 5px;
    width: 260px;
    background:#ffffff;
    border: 1px dashed #CCCCCC;
   
}
#accordion div.blocks_littles p{
 color: #005058;
    font-size: 18px;
    font-weight: normal;
    margin: -2px;
  padding: 0 0 4px 4px;
   text-align: center;
    line-height: normal;
    &lt;!-- border-bottom: 1px solid #CCCCCC;-->
     
}
#accordion div.blocks_littles img{
      float: left;
    margin: 9px 4px;
padding:3px 2px -1px 5px;
/*border: 1px dashed #CCCCCC;*/
}
  </style>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
      <script type="text/javascript" src="accordion.js"></script>
      <script type="text/javascript">
$(document).ready(function(){

$('#accordion div.big_blocks:not(:first)').hide();
$('h3.head:first').addClass('active');

  $('h3.head:not(.active)').live('click',function(){
    $(this).addClass('active');
    $(this).next().slideDown(760);
  });

  $('h3.head.active').live('click',function(){
    $(this).removeClass('active');
    $(this).next().slideUp(760);
  });

});
</script>
    </head>
 <body>


Вот весь хидер

Цитата:
Вот эти два скрипта
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
      <script type="text/javascript" src="accordion.js"></script>

Переставил - увидите


============
*Поправил

dimas15 21.08.2012 21:49
Deff,
у меня почему то блоки друг на друга наезжают при открытии?

dimas15 21.08.2012 21:50
Deff,
И они сами закрываются а не при клике...(

Deff 21.08.2012 21:55
Цитата:
Сообщение от dimas15
у меня почему то блоки друг на друга наезжают при открытии?
Выложите полный код заново

Deff 21.08.2012 22:00
dimas15,
У меня лично так(стиль не загружал) http://hostjs-mybb2011.narod.ru/dimas15.htm

dimas15 21.08.2012 22:01
Deff,
// Когда страница полностью загружена
$(window).ready(function()
{
// запоминаем высоту и отступы каждого блока
$('#accordion > div').each(function()
{
$(this).data('height', $(this).height());
$(this).data('padding-top', $(this).css('padding-top'));
$(this).data('padding-bottom', $(this).css('padding-bottom'));
});

// Скрываем все секции кроме первой
$('#accordion > div:not(:first)').hide();
// Делаем первую секцию активной
$('#accordion h3:first, #accordion div:first').addClass('active');
// Если пользователь кликнул на секцию
$('#accordion > h3').click(function()
{
// Сбрасываем все секции
if ($(this).hasClass('active')) {
$(this).removeClass('active');
$('#accordion > div:visible').animate({height: 0, 'padding-top': 0, 'padding-bottom': 0}, 500, function() { $(this).hide() } );
}
else {
// Делаем активной на которую кликнули
$(this).addClass('active');
box = $(this).next().addClass('active');
$(box).animate(
{
height: $(box).data('height'),
'padding-top': $(box).data('padding-top'),
'padding-bottom': $(box).data('padding-bottom')
}, 500);
}
});
});

dimas15 21.08.2012 22:02
Deff,
это был скрипт

dimas15 21.08.2012 22:02
Deff,
<html>
<head>
<title></title>
<link href="base.css" rel="stylesheet" type="text/css" />
<link href="accordion.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="accordion.js"></script>
</head>
<body>
<div id="wrap">
<div id="accordion">
<h3 class="head">Листогибочное оборудование</h3>
<div class="big_blocks">
<div class="blocks_littles">
<p>Листогибочные прессы</p>
<img src="../upload/test_metall/list_press.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/press_phe/">DENER MAKINA</a></li>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Листогибочные машины</p>
<img src="../upload/test_metall/listabgib_mash.jpg" alt="" width="100" height="137" />
<ul>
<li>IMCAR</li>
<li><a href="catalog/category/918/">HACO</a></li>
<li><a href="catalog/category/bendmak/">BENDMAK</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Листогибочный инструмент</p>
<img src="../upload/test_metall/list_s_pov_balk.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/641/">ROLLERI</a></li>
<li>EURAM</li>
<li>EUROSTAMP</li>
</ul>
</div>
<div class="blocks_littles">
<p>Листогибы с поворотной балкой</p>
<img src="../upload/test_metall/s_pov_balk.jpg" alt="" width="100" height="137" />
<ul>
<span>Ручные:</span><br />
<li><a href="catalog/category/listogiby_ruchnye/">AYSANMAK</a></li>
<br /> <span>Электрические:</span><br />
<li><a href="catalog/category/jordi/">DENER MAKINA</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Прoбивочный инструмент</p>
<img src="../upload/test_metall/prib_instrum.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/634/">SU.CE</a></li>
</ul>
</div>
</div>

<h3 class="head">Металлорежущее оборудование</h3>
<div class="big_blocks">
<div class="blocks_littles">
<p>Токарные станки</p>
<img src="../upload/test_metall/tok_st.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/673/">СAMPRO</a></li>
<li><a href="catalog/category/656/">TRENS</a></li>
<li><a href="catalog/category/921/">MING YANG</a></li>
<li>KAAST</li>
</ul>
</div>
<div class="blocks_littles">
<p>Фрезерные станки</p>
<img src="../upload/test_metall/tok_frez.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/673/">CAMPRO</a></li>
<li>KAAST</li>
</ul>
</div>
<div class="blocks_littles">
<p>Сверлильные и горизонтально-расточные станки</p>
<img src="../upload/test_metall/_IMAC.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/915/">IMAC</a></li>
<li>KAAST</li>
<li>HELTOS</li>
</ul>
</div>
<div class="blocks_littles">
<p>Ленточнопильные и дисковые станки</p>
<img src="../upload/test_metall/lentochn_piln.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/lentochnopilnye_stanki_bekamak/">BEKAMAK</a></li>
<li><a href="catalog/category/lentopilnye_stanki_klaeger/">KLAEGER</a></li>
<li><a href="catalog/category/897/">SCOTCHMAN</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Шлифовальное оборудование</p>
<img src="../upload/test_metall/obor_shlif.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/624/">GECAM</a></li>
<li><a href="catalog/category/629/">JACOB LOEWER</a></li>
<li><a href="catalog/category/639/">VIBROCHIMICA</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Резьбонарезные станки</p>
<img src="../upload/test_metall/rezbonar_cbc.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/631/">CBC</a></li>
</ul>
</div>
</div>
<h3 class="head">Оборудование для резки и раскроя листа и трубы</h3>
<div class="big_blocks">
<div class="blocks_littles">
<p>Гильотинные ножницы</p>
<img src="../upload/test_metall/shearmaster-610.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/jordi/">DENER MAKINA</a></li>
<li><a href="catalog/category/listogiby_ruchnye/">AYSANMAK</a></li>
<li><a href="catalog/category/scotchman/">SCOTCHMAN</a></li>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Портальные машины плазменной резки</p>
<img src="../upload/test_metall/plaz_rezka1.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/916/">DENER MAKINA</a></li>
<li><a href="catalog/category/service-soitaab/">SOITAAB</a></li>
<li><a href="catalog/category/918/">HACO</a></li>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Портальные машины лазерной резки</p>
<img src="../upload/test_metall/laz_rezk.jpg" alt="" width="100" height="137" />
<ul>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Пресс-ножницы</p>
<img src="../upload/test_metall/01met.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/scotchman/">SCOTCHMAN</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Координатно-пробивочные прессы</p>
<img src="../upload/test_metall/koord_prib_presu.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/635/">TAILIFT</a></li>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Угловысечные прессы</p>
<img src="../upload/test_metall/ygl_vus_st.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/648/">GECAM</a></li>
<li><a href="catalog/category/jordi/">DENER MAKINA</a></li>
</ul>
</div>
</div>

<h3 class="head">Оборудование для гибки труб и профилей</h3>
<div class="big_blocks">
<div class="blocks_littles">
<p>Профилегибы</p>
<img src="../upload/test_metall/profel.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/profilegiby-comac/">СOMAC</a></li>
<li><a href="catalog/category/bendmak/">BENDMAK</a></li>
<li><a href="catalog/category/651/">THOMAN</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Трубогибы</p>
<img src="../upload/test_metall/trubogibu.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/630/">CBC</a></li>
<li><a href="catalog/category/651/">THOMAN</a></li>
</ul>
</div>
</div>

<h3 class="head">Сварочное оборудование</h3>
<div class="big_blocks">
<div class="blocks_littles">
<p>Дуговая сварка</p>
<img src="../upload/test_metall/dyg.jpg" alt="" width="100" height="137" />
<ul>
<span><a href="catalog/category/dugovaya-svarka/">Migatronic</a>:</span><br />
<li><a href="catalog/category/ruchnaya-dugovaya-svarka/">Ручная</a></li>
<li><a href="catalog/category/poluavtomaticheskaya-svarka/">Полуавтомат</a></li>
<li><a href="catalog/category/argonodugovaya-svarka/">Аргон</a></li>
<li><a href="catalog/category/plazmennaya-svarka/">Плазма</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Контактная сварка</p>
<img src="../upload/test_metall/contact_svar.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="category/kontaktnaya-svarka/">DALEX</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Плазменная резка</p>
<img src="../upload/test_metall/plaz_rezka.jpg" alt="" width="100" height="137" />
<ul>
<li><a href="catalog/category/plazmennaya-rezka/">MIGATRONIC</a></li>
</ul>
</div>
</div>
</div>

<br />
</div>
</body>
</html>

Deff 21.08.2012 22:03
Цитата:
Сообщение от dimas15
И они сами закрываются а не при клике...(
:) Вы Полностью заменили верх страницы и учли про подгружаемые скрипты ?

Deff 21.08.2012 22:04
dimas15,
Воткните Ваш код в теги [HTML][/HTML]
Иначе плохо читаем!

dimas15 21.08.2012 22:05
Deff,
В этом примере при закрытии одного сектора закрываются все. и ссылок активных много становится сразу...а так вроде все норм.

dimas15 21.08.2012 22:07 
// Когда страница полностью загружена
$(window).ready(function()
{
// запоминаем высоту и отступы каждого блока
$('#accordion > div').each(function()
{
$(this).data('height', $(this).height());
$(this).data('padding-top', $(this).css('padding-top'));
$(this).data('padding-bottom', $(this).css('padding-bottom'));
});

// Скрываем все секции кроме первой
$('#accordion > div:not(:first)').hide();
// Делаем первую секцию активной
$('#accordion h3:first, #accordion div:first').addClass('active');
// Если пользователь кликнул на секцию
$('#accordion > h3').click(function()
{
// Сбрасываем все секции
if ($(this).hasClass('active')) {
$(this).removeClass('active');
$('#accordion > div:visible').animate({height: 0, 'padding-top': 0, 'padding-bottom': 0}, 500, function() { $(this).hide() } );
}
else {
// Делаем активной на которую кликнули
$(this).addClass('active');
box = $(this).next().addClass('active');
$(box).animate(
{
height: $(box).data('height'),
'padding-top': $(box).data('padding-top'),
'padding-bottom': $(box).data('padding-bottom')
}, 500);
}
});
});

Deff 21.08.2012 22:07
dimas15Вы сообщение 23 смотрели ?
Показать исходный код
Выбросите всё - включая первый тег <body> и замените из поста 23

Просмотрите про скрипты - дабы ниже повтор не остался

dimas15 21.08.2012 22:07 
<html>
<head>
	<title></title>
	<link href="base.css" rel="stylesheet" type="text/css" />
	<link href="accordion.css" rel="stylesheet" type="text/css" />
	
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
	<script type="text/javascript" src="accordion.js"></script>
</head>
<body>
<div id="wrap">
	<div id="accordion">
		<h3 class="head">Листогибочное оборудование</h3>
		<div class="big_blocks">
<div class="blocks_littles">
<p>Листогибочные прессы</p>
<img src="../upload/test_metall/list_press.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/press_phe/">DENER MAKINA</a></li>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Листогибочные машины</p>
<img src="../upload/test_metall/listabgib_mash.jpg" alt="" width="100" height="137" /> 
<ul>
<li>IMCAR</li>
<li><a href="catalog/category/918/">HACO</a></li>
<li><a href="catalog/category/bendmak/">BENDMAK</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Листогибочный инструмент</p>
<img src="../upload/test_metall/list_s_pov_balk.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/641/">ROLLERI</a></li>
<li>EURAM</li>
<li>EUROSTAMP</li>
</ul>
</div>
<div class="blocks_littles">
<p>Листогибы с поворотной балкой</p>
<img src="../upload/test_metall/s_pov_balk.jpg" alt="" width="100" height="137" /> 
<ul>
<span>Ручные:</span><br />
<li><a href="catalog/category/listogiby_ruchnye/">AYSANMAK</a></li>
<br /> <span>Электрические:</span><br />
<li><a href="catalog/category/jordi/">DENER MAKINA</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Прoбивочный инструмент</p>
<img src="../upload/test_metall/prib_instrum.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/634/">SU.CE</a></li>
</ul>
</div>
</div>
		
		<h3 class="head">Металлорежущее оборудование</h3>
		<div class="big_blocks">
<div class="blocks_littles">
<p>Токарные станки</p>
<img src="../upload/test_metall/tok_st.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/673/">СAMPRO</a></li>
<li><a href="catalog/category/656/">TRENS</a></li>
<li><a href="catalog/category/921/">MING YANG</a></li>
<li>KAAST</li>
</ul>
</div>
<div class="blocks_littles">
<p>Фрезерные станки</p>
<img src="../upload/test_metall/tok_frez.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/673/">CAMPRO</a></li>
<li>KAAST</li>
</ul>
</div>
<div class="blocks_littles">
<p>Сверлильные и горизонтально-расточные станки</p>
<img src="../upload/test_metall/_IMAC.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/915/">IMAC</a></li>
<li>KAAST</li>
<li>HELTOS</li>
</ul>
</div>
<div class="blocks_littles">
<p>Ленточнопильные и дисковые станки</p>
<img src="../upload/test_metall/lentochn_piln.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/lentochnopilnye_stanki_bekamak/">BEKAMAK</a></li>
<li><a href="catalog/category/lentopilnye_stanki_klaeger/">KLAEGER</a></li>
<li><a href="catalog/category/897/">SCOTCHMAN</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Шлифовальное оборудование</p>
<img src="../upload/test_metall/obor_shlif.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/624/">GECAM</a></li>
<li><a href="catalog/category/629/">JACOB LOEWER</a></li>
<li><a href="catalog/category/639/">VIBROCHIMICA</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Резьбонарезные станки</p>
<img src="../upload/test_metall/rezbonar_cbc.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/631/">CBC</a></li>
</ul>
</div>
</div>
		<h3 class="head">Оборудование для резки и раскроя листа и трубы</h3>
		<div class="big_blocks">
<div class="blocks_littles">
<p>Гильотинные ножницы</p>
<img src="../upload/test_metall/shearmaster-610.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/jordi/">DENER MAKINA</a></li>
<li><a href="catalog/category/listogiby_ruchnye/">AYSANMAK</a></li>
<li><a href="catalog/category/scotchman/">SCOTCHMAN</a></li>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Портальные машины плазменной резки</p>
<img src="../upload/test_metall/plaz_rezka1.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/916/">DENER MAKINA</a></li>
<li><a href="catalog/category/service-soitaab/">SOITAAB</a></li>
<li><a href="catalog/category/918/">HACO</a></li>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Портальные машины лазерной резки</p>
<img src="../upload/test_metall/laz_rezk.jpg" alt="" width="100" height="137" /> 
<ul>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Пресс-ножницы</p>
<img src="../upload/test_metall/01met.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/scotchman/">SCOTCHMAN</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Координатно-пробивочные прессы</p>
<img src="../upload/test_metall/koord_prib_presu.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/635/">TAILIFT</a></li>
<li>AMADA</li>
</ul>
</div>
<div class="blocks_littles">
<p>Угловысечные прессы</p>
<img src="../upload/test_metall/ygl_vus_st.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/648/">GECAM</a></li>
<li><a href="catalog/category/jordi/">DENER MAKINA</a></li>
</ul>
</div>
</div>
	
	<h3 class="head">Оборудование для гибки труб и профилей</h3>
		<div class="big_blocks">
<div class="blocks_littles">
<p>Профилегибы</p>
<img src="../upload/test_metall/profel.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/profilegiby-comac/">СOMAC</a></li>
<li><a href="catalog/category/bendmak/">BENDMAK</a></li>
<li><a href="catalog/category/651/">THOMAN</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Трубогибы</p>
<img src="../upload/test_metall/trubogibu.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/630/">CBC</a></li>
<li><a href="catalog/category/651/">THOMAN</a></li>
</ul>
</div>
</div>
	
	<h3 class="head">Сварочное оборудование</h3>
		<div class="big_blocks">
<div class="blocks_littles">
<p>Дуговая сварка</p>
<img src="../upload/test_metall/dyg.jpg" alt="" width="100" height="137" /> 
<ul>
<span><a href="catalog/category/dugovaya-svarka/">Migatronic</a>:</span><br />
<li><a href="catalog/category/ruchnaya-dugovaya-svarka/">Ручная</a></li>
<li><a href="catalog/category/poluavtomaticheskaya-svarka/">Полуавтомат</a></li>
<li><a href="catalog/category/argonodugovaya-svarka/">Аргон</a></li>
<li><a href="catalog/category/plazmennaya-svarka/">Плазма</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Контактная сварка</p>
<img src="../upload/test_metall/contact_svar.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="category/kontaktnaya-svarka/">DALEX</a></li>
</ul>
</div>
<div class="blocks_littles">
<p>Плазменная резка</p>
<img src="../upload/test_metall/plaz_rezka.jpg" alt="" width="100" height="137" /> 
<ul>
<li><a href="catalog/category/plazmennaya-rezka/">MIGATRONIC</a></li>
</ul>
</div>
</div>
	</div>
	
	<br />
</div>
</body>
</html>

dimas15 21.08.2012 22:10
Deff,
Вроде сделал так как вы сказали:write:

dimas15 21.08.2012 22:11
Deff,
23 сообщение смотрел

Deff 21.08.2012 22:13
dimas15,
А скрипт то ?
Он должен стоять следом за
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
 <script type="text/javascript" src="accordion.js"></script>


(Или вы его засунули в accordion.js ?

dimas15 21.08.2012 22:16
Deff,
вы можете свой вариант скинуть http://hostjs-mybb2011.narod.ru/dimas15.htm на почту k0ratei@mail.ru
премного благодарен


Часовой пояс GMT +3, время: 15:24.
Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице