Jplayer и не только
у меня есть цикл в php foreach через который я получаю id_product для каждого аудио , а так же ссылка на него . В общем я сделал так
<script type="text/javascript">
$(document).ready(function(){
var myCirclePlayer = new CirclePlayer("#jquery_jplayer_{$item.id_product}",
{
mp3: "download/{$item.audio_link}",
oga: "download/{$item.audio_link}"
}, {
cssSelectorAncestor: "#cp_container_{$item.id_product}"
});
});
</script>
все это я вставляю в foreach цикле итого получается что для каждого плеера я вывожу ссылку именно ту которую надо , но получается какой то баг, воспроизводится только половина аудио и еще остальной js код на сайте багается, в общем что делать? может стоит как-то по другому это делать ? |
инфу которую вы дали мало
|
skrudjmakdak,
вот цикл смарти, ничего особенного {foreach from=$listFeature item=item} а вот мой див
<div id="jquery_jplayer_{$item.id_product}" class="cp-jplayer"></div>
<div id="cp_container_{$item.id_product}" class="cp-container">
работает скрипт как то криво воспроизводит только для первых 7-и, хотя у меня 12 элементов, так же при этом багает остальной джаваскрипт на сайте Может есть какой то другой способ выводить эти плееры , у меня есть id и ссылка на аудио |
можешь прислать страницу сгенерированную? зайди по урле которая генерит страницу и нажми ctrl + U
|
<li>
<article>
<div class="featured-item box-hover clearfix">
<div class="entry-content">
<script type="text/javascript">
$(document).ready(function(){
var myCirclePlayer = new CirclePlayer("#jquery_jplayer_4",
{
mp3: "download/73773e469f3f3d56dd6fad862b25eb8a11ad591c.mp3",
oga: "download/73773e469f3f3d56dd6fad862b25eb8a11ad591c.mp3"
}, {
cssSelectorAncestor: "#cp_container_4"
});
});
</script>
<div id="jquery_jplayer_4" class="cp-jplayer"></div>
<div class="prototype-wrapper"> <!-- A wrapper to emulate use in a webpage and center align -->
<!-- The container for the interface can go where you want to display it. Show and hide it as you need. -->
<div id="cp_container_4" class="cp-container">
<div class="cp-buffer-holder"> <!-- .cp-gt50 only needed when buffer is > than 50% -->
<div class="cp-buffer-1"></div>
<div class="cp-buffer-2"></div>
</div>
<div class="cp-progress-holder"> <!-- .cp-gt50 only needed when progress is > than 50% -->
<div class="cp-progress-1"></div>
<div class="cp-progress-2"></div>
</div>
<div class="cp-circle-control"></div>
<ul class="cp-controls">
<li><a class="cp-play" tabindex="1">play</a></li>
<li><a class="cp-pause" style="display:none;" tabindex="1">pause</a></li> <!-- Needs the inline style here, or jQuery.show() uses display:inline instead of display:block -->
</ul>
</div>
</div>
<h4 class="entry-title">
<a href="http://audio-mail.net/index.php?id_product=4&controller=product&id_lang=7" target="_self" title="4">4</a>
</h4>
<h5 class="entry-category">
<a title="с-днем-рождения">С Днем рождения</a>
</h5>
<div class="lof-main-puplic">
<a class="lof-add-cart ajax_add_to_cart_button" rel="ajax_id_product_4" href="http://audio-mail.net/cart.php?add&id_product=4&token=96865e90fe9887119ba26e57abb9448a"><span>отправить</span></a>
</div>
</div>
</div>
</article>
</li>
<li>
<article>
<div class="featured-item box-hover clearfix">
<div class="entry-content">
<script type="text/javascript">
$(document).ready(function(){
var myCirclePlayer = new CirclePlayer("#jquery_jplayer_5",
{
mp3: "download/607a7fcb55696175b477709279b01d3fa597d97d.mp3",
oga: "download/607a7fcb55696175b477709279b01d3fa597d97d.mp3"
}, {
cssSelectorAncestor: "#cp_container_5"
});
});
</script>
<div id="jquery_jplayer_5" class="cp-jplayer"></div>
<div class="prototype-wrapper"> <!-- A wrapper to emulate use in a webpage and center align -->
<!-- The container for the interface can go where you want to display it. Show and hide it as you need. -->
<div id="cp_container_5" class="cp-container">
<div class="cp-buffer-holder"> <!-- .cp-gt50 only needed when buffer is > than 50% -->
<div class="cp-buffer-1"></div>
<div class="cp-buffer-2"></div>
</div>
<div class="cp-progress-holder"> <!-- .cp-gt50 only needed when progress is > than 50% -->
<div class="cp-progress-1"></div>
<div class="cp-progress-2"></div>
</div>
<div class="cp-circle-control"></div>
<ul class="cp-controls">
<li><a class="cp-play" tabindex="1">play</a></li>
<li><a class="cp-pause" style="display:none;" tabindex="1">pause</a></li> <!-- Needs the inline style here, or jQuery.show() uses display:inline instead of display:block -->
</ul>
</div>
</div>
<h4 class="entry-title">
<a href="http://audio-mail.net/index.php?id_product=5&controller=product&id_lang=7" target="_self" title="5">5</a>
</h4>
<h5 class="entry-category">
<a title="с-днем-рождения">С Днем рождения</a>
</h5>
<div class="lof-main-puplic">
<a class="lof-add-cart ajax_add_to_cart_button" rel="ajax_id_product_5" href="http://audio-mail.net/cart.php?add&id_product=5&token=96865e90fe9887119ba26e57abb9448a"><span>отправить</span></a>
</div>
</div>
</div>
</article>
</li>
<li>
<article>
<div class="featured-item box-hover clearfix">
<div class="entry-content">
<script type="text/javascript">
$(document).ready(function(){
var myCirclePlayer = new CirclePlayer("#jquery_jplayer_6",
{
mp3: "download/da3ec71cac0b87dedb90b44156246e29140bae15.mp3",
oga: "download/da3ec71cac0b87dedb90b44156246e29140bae15.mp3"
}, {
cssSelectorAncestor: "#cp_container_6"
});
});
</script>
<div id="jquery_jplayer_6" class="cp-jplayer"></div>
<div class="prototype-wrapper"> <!-- A wrapper to emulate use in a webpage and center align -->
<!-- The container for the interface can go where you want to display it. Show and hide it as you need. -->
<div id="cp_container_6" class="cp-container">
<div class="cp-buffer-holder"> <!-- .cp-gt50 only needed when buffer is > than 50% -->
<div class="cp-buffer-1"></div>
<div class="cp-buffer-2"></div>
</div>
<div class="cp-progress-holder"> <!-- .cp-gt50 only needed when progress is > than 50% -->
<div class="cp-progress-1"></div>
<div class="cp-progress-2"></div>
</div>
<div class="cp-circle-control"></div>
<ul class="cp-controls">
<li><a class="cp-play" tabindex="1">play</a></li>
<li><a class="cp-pause" style="display:none;" tabindex="1">pause</a></li> <!-- Needs the inline style here, or jQuery.show() uses display:inline instead of display:block -->
</ul>
</div>
</div>
и так далее |
с чего ты взял что ошибка именно в том месте где ты прислал? ведь это html, а js я не нашел вообще. за исключением
$(document).ready(function(){
var myCirclePlayer = new CirclePlayer("#jquery_jplayer_{$item.id_product}",
{
mp3: "download/{$item.audio_link}",
oga: "download/{$item.audio_link}"
}, {
cssSelectorAncestor: "#cp_container_{$item.id_product}"
});
});
у тебя есть какой то класс CirclePlayer, хер его знает что он делает, может ошибка там? посмотри в консоли, что выдает, может ошибка явно вываливается, если нет расставь console.log(xx) чтобы посмотреть промежуточные результаты. умеешь пользоваться фаербагом? просто я реально тебе говорю, по своему опыту. ошибка может где угодно, даже где ее не ждешь. либо тут надо см весь проект |
| Часовой пояс GMT +3, время: 14:58. |