[Решено] Спойлера в карточке товара

[kate1987]

Здравствуйте

Использую Opencart 1,5,6

Хотела вывести нужную инфу в спойлер в карточку товара (при  клике на ссылку опции наличие)

Не могу сдлать скрипт, который бы отображал спойлер для каждого товара на странице категории

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

[kate1987]

добавила

 <div id="id_<?php echo $product_id?>" class="spoiler">Content1</div> 
    <a href="id_<?php echo $product_id ?>" class="spoilerButton">Show/Hide1</a>

 <script type="text/javascript">
   jQuery(document).ready(function(){
        jQuery(".spoilerButton").click(function (e) { 
            e.preventDefault()
            var foo=jQuery(this).attr('href')
           jQuery('#'+foo).slideToggle(1000); 
        });
    });
</script>

но к href добавляется в начале слеш, поэтому не работает

[afwollis]

:twisted:

<div id="spoiler_<?php echo $product_id; ?>" class="spoiler">Content1</div>
<a data-target-spoiler="spoiler_<?php echo $product_id; ?>" class="spoilerButton">Show/Hide1</a>
...
<script type="text/javascript">
$('.spoilerButton').click(function() {
var spoilerId = $(this).attr('data-target-spoiler');
$('#'+spoilerId).slideToggle(1000);
});
</script>

[kate1987]

Все круто, но вот только странный эффект

Если бы захотел никогда б такого не получилось, а тут вот)

https://www.youtube.com/watch?v=g00fIzkNT9I

[kate1987]

В итоге у меня получилось так

<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
//-->
</script>

 <span><a id="displayText" class="nal" onclick="toggle_visibility('spoiler_<?php echo $product_id; ?>');">Опции/наличие </a> ▼</span>
<div style="display: none" id="spoiler_<?php echo $product_id; ?>">This is foo</div>

Спасибо

afwollis за участвие)

[afwollis]

а при чем тут категории? :?

вот для них:

отправим к сравнению, чтоб наглядно было, поменяем product_id на правильную переменную, js обернем в "$(document).ready" и "slideToggle()" сделаем "slow"

      <div class="compare"><a onclick="addToCompare('<?php echo $product['product_id']; ?>');"><?php echo $button_compare; ?></a>
<div id="spoiler_<?php echo $product['product_id']; ?>" class="spoiler">Content1</div>
<a data-target-spoiler="spoiler_<?php echo $product['product_id']; ?>" class="spoilerButton">Show/Hide1</a>
      </div>
...
<script type="text/javascript">
$(document).ready(function() {
	$('.spoilerButton').click(function() {
		var spoilerId = $(this).attr('data-target-spoiler');
		$('#'+spoilerId).slideToggle('slow');
	});
});
</script>

[kate1987]

Не могу сдлать скрипт, который бы отображал спойлер для каждого товара на странице категории писала же)

Змінено 24 березня 2015 користувачем afwollis

[afwollis]

ааааааа... недочитал несколько слов, получается... :rolleyes:

вот это

...toggle_visibility('spoiler_<?php echo $product_id; ?>')...

должно отдавать ошибку.

а с последним моим кодом всё ок :-)