将PHP代码插入jQuery Slider时出现问题 [英] Problem inserting PHP code into jQuery Slider

查看:57
本文介绍了将PHP代码插入jQuery Slider时出现问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

(我是php / mysql的新手,请原谅)



这里'是我正在玩jQuery滑块的页面(jContent)滑块):



http://www.tradeglobus.com/index2.php



问题是的,让我们说这个jContent滑块有4张幻灯片,&我希望它从mysql&获取数据在所有四张幻灯片中显示它。

令我困惑的是它在第一张幻灯片上显示前四个产品,然后它必须从下一张幻灯片的第五个产品继续....&等等。



但它以相同的顺序调用数据,例如:

Slide1:

Product1 - 产品2 - 产品3 - 产品4



Slide2:

产品1 - 产品2 - 产品3 - 产品4



幻灯片3:

产品1 - 产品2 - 产品3 - 产品4



Slide4:

产品1 - 产品2 - 产品3 - 产品4



并且它不是从下一张幻灯片的第5个产品开始的。

what&哪里可能是问题?

这里是滑块代码:

 <   div     class   =  GridHeading >  jContent Slider <   / div  >  
< div class = GridContent 样式 = 身高:250像素;宽度:550px; >

< script < span class =code-attribute> type = text / javascript language = javascript src = bx / jquery-1.8.3.min.js > < / script >
< script 类型 = text / javascript language = javascript src = bx / jquery.bxslider.js > < / script >
< link href = bx / jquery.bxslider.css rel = stylesheet 类型 = text / css / >

< span class =code-keyword>< script type = text / javascript 语言 = javascript >
var $ bx = jQuery.noConflict();
$ bx( document )。ready( function (){
$ bx (' .slip2')。bxSlider({
auto: true
slideWidth: 400
minSlides: 2
maxSlides: 2
slideMargin: 10
});
});
< / script >

< div class = slider2 >
< div class = slide >
< img src = http:// placehol d.it/350x150&text=FooBar1\">
< img src = http://placehold.it/350x150&text=FooBar2 > < / div >
< div class = slide >
< img < span class =code-attribute>
src = http://placehold.it/350x150&text=FooBar3 >
< img src = http://placehold.it/350x150&text=FooBar4 > < / div >
< div < span class =code-attribute> class = slide >
< img src = http://placehold.it/350x150&text=FooBar5 >
< img src = http ://placehold.it/350x150& text = FooBar6 > < < span class =code-leadattribute> / div >
< div class = slide >
< img src = http://placehold.it/350x150&text = FooBar7 >
< img src = http://placehold.it/350x150&text=FooBar8 > < / div >
< span class =code-keyword>< div class = slide >
< img src = http://placehold.it/350x150&text=FooBar9 >
< img src = http://placehold.it/350x150&text=FooBar10 > < / div >
< / div >
< / div >





这里是我正在应用于jquery的代码SL ides在每张幻灯片上显示4个单元格:

 <   ul  >  
<? php
$ Query = clsMembers :: getSupplierByLimit(16,0);
$ SupplierList = $ objDatabase-> runStoredProcedure($ Query);

if(count($ SupplierList))
{
foreach($ SupplierList as $ Supplier)
{
echo ' < li style =height:110px; width:275px; border-removed 1px solid#99CCFF;>
< table cellpadding =0cellspacing =0border =0width =100%height =125pxstyle =padding-removed 15px; padding-removed 10px;>
< tr>
< td align =centervalign =toprowspan =2width =90px>
< a href ='
.BASE_HOST。' companies_details /' 。$ Supplier [' MemberID']。' /' .clsPresent :: removeSpecialChars($ Supplier [' company_name'])。' 。htm>
< img src ='
.clsPresent :: checkImageExistance(BASE_HOST.DEFAULT_COMPANY_LOGO_PATH。$ Supplier [' company_logo'])。' class =classimgwidth =80pxheight = 80px >
< / a>
< / td>
< td align =leftvalign =topclass =removedwidth =200pxstyle =height:15px;>
< a href ='
.BASE_HOST。' companies_details /' 。$ Supplier [' MemberID']。' /' .clsPresent :: removeSpecialChars($ Supplier [' company_name'])。' 。htm>'。 ((strlen($ Supplier [' company_name'])> 30)?(substr($ Supplier) [' company_name'],0,27)。 ...):$ Supplier [' company_name'])。 ' < / a>
< / td>
< / tr>
< tr>
< td align =leftvalign =topclass =contentheight =105px>
< span style =line-height:15px;>
'
。 ((isset($ Supplier [' company_desc'])&& $ Supplier [' company_desc']!= )?((strlen($ Supplier [' company_desc'])> 130)?(substr($ Supplier [' company_desc'],0,127 )。 ...):$ Supplier [ ' company_desc']): )。 '
< / span>
< / td>
< / tr>
< / table>
< / li>'
;
}
}
?>

< ; / ul >





请有人帮我这个,我花了4天多时间来解决这个问题。



在此先感谢

Raza Khan

解决方案

bx = jQuery.noConflict( true );


bx( document )。ready( function (){


bx(' 。slider2')。 bxSlider({
auto: true
slideWidth: 400
minSlides: 2
maxSlides: 2
slideMargin: 10
});
});
< / script >

< div class = slider2 >
< div class = slide >
< img src = http:// placehol d.it/350x150&text=FooBar1\">
< img src = http://placehold.it/350x150&text=FooBar2 > < / div >
< div class = slide >
< img < span class =code-attribute> src = http://placehold.it/350x150&text=FooBar3 >
< img src = http://placehold.it/350x150&text=FooBar4 > < / div >
< div < span class =code-attribute> class = slide >
< img src = http://placehold.it/350x150&text=FooBar5 >
< img src = http ://placehold.it/350x150& text = FooBar6 > < < span class =code-leadattribute> / div >
< div class = slide >
< img src = http://placehold.it/350x150&text = FooBar7 >
< img src = http://placehold.it/350x150&text=FooBar8 > < / div >
< span class =code-keyword>< div class = slide >
< img src = http://placehold.it/350x150&text=FooBar9 >
< img src = http://placehold.it/350x150&text=FooBar10 > < / div >
< / div >
< / div >





这里是我正在应用于jquery的代码SL ides在每张幻灯片上显示4个单元格:

 <   ul  >  
<? php

(I''m new to php/mysql, please excuse)

here''s the page where I''m playing with jQuery slider (jContent Slider):

http://www.tradeglobus.com/index2.php

The problem is, lets say this jContent slider has 4 slides, & I want it to get the data from mysql & display it in all four slides.
What is confusing me is that it displays the first four products on 1st slide, then it must continue from 5th product on next slide....& so on.

but its calling the data in same sequence, like:
Slide1:
Product1 - Product2 - Product3 - Product4

Slide2:
Product1 - Product2 - Product3 - Product4

Slide3:
Product1 - Product2 - Product3 - Product4

Slide4:
Product1 - Product2 - Product3 - Product4

and its not starting from 5th product on the next slide.
what & where could be the problem ?
here''s the slider code:

          <div class="GridHeading">jContent Slider</div>
          <div class="GridContent" style="height: 250px; width: 550px;">

        <script type="text/javascript" language="javascript" src="bx/jquery-1.8.3.min.js"></script> 
	<script type="text/javascript" language="javascript" src="bx/jquery.bxslider.js"></script>
        <link href="bx/jquery.bxslider.css" rel="stylesheet" type="text/css"/> 
        
		<script type="text/javascript" language="javascript">
				var $bx = jQuery.noConflict(true);
				$bx(document).ready(function(){
				$bx('.slider2').bxSlider({
				auto: true,
				slideWidth: 400,
				minSlides: 2,
				maxSlides: 2,
				slideMargin: 10
  });
});
        </script>	         	        

<div class="slider2">
  <div class="slide">
  <img src="http://placehold.it/350x150&text=FooBar1">
  <img src="http://placehold.it/350x150&text=FooBar2"></div>
  <div class="slide">
  <img src="http://placehold.it/350x150&text=FooBar3">
  <img src="http://placehold.it/350x150&text=FooBar4"></div>
  <div class="slide">
  <img src="http://placehold.it/350x150&text=FooBar5">
  <img src="http://placehold.it/350x150&text=FooBar6"></div>
  <div class="slide">
  <img src="http://placehold.it/350x150&text=FooBar7">
  <img src="http://placehold.it/350x150&text=FooBar8"></div>
  <div class="slide">
  <img src="http://placehold.it/350x150&text=FooBar9">
  <img src="http://placehold.it/350x150&text=FooBar10"></div>
</div>
</div>



And here''s the code I''m applying to jquery slides to show 4 cells on each slide:

 <ul>
    <?php
        $Query = clsMembers::getSupplierByLimit(16, 0);
        $SupplierList = $objDatabase->runStoredProcedure($Query);

        if(count($SupplierList))
        {
            foreach($SupplierList as $Supplier)
            {
                echo '<li style="height:110px; width:275px; border-removed 1px solid #99CCFF;">
                        <table cellpadding="0" cellspacing="0" border="0" width="100%" height="125px" style="padding-removed 15px; padding-removed 10px;">
                            <tr>
                                <td align="center" valign="top" rowspan="2" width="90px">
                                    <a href="' . BASE_HOST . 'companies_details/' . $Supplier['MemberID'] . '/' . clsPresent::removeSpecialChars($Supplier['company_name']) . '.htm">
                                        <img src="' . clsPresent::checkImageExistance(BASE_HOST . DEFAULT_COMPANY_LOGO_PATH . $Supplier['company_logo']) . '" class="classimg" width="80px" height="80px">
                                    </a>
                                </td>
                                <td align="left" valign="top" class="removed" width="200px" style="height: 15px;">
                                    <a href="' . BASE_HOST . 'companies_details/' . $Supplier['MemberID'] . '/' . clsPresent::removeSpecialChars($Supplier['company_name']) . '.htm">' . ((strlen($Supplier['company_name']) > 30) ? (substr($Supplier['company_name'], 0, 27) . "...") : $Supplier['company_name']) . '</a>
                                </td>
                            </tr>
                            <tr>
                                <td align="left" valign="top" class="content" height="105px">
                                    <span style="line-height: 15px;">
                                        ' . ((isset($Supplier['company_desc']) && $Supplier['company_desc'] != "") ? ((strlen($Supplier['company_desc']) > 130) ? (substr($Supplier['company_desc'], 0, 127) . "...") : $Supplier['company_desc']) : "") . '
                                    </span>
                                </td>
                            </tr>
                        </table>
                      </li>';
            }
        }
    ?>

</ul>



Please somebody help me with this, I''ve spent over 4 days to resolve this issue.

Thanks in advance
Raza Khan

解决方案

bx = jQuery.noConflict(true);


bx(document).ready(function(){


bx('.slider2').bxSlider({ auto: true, slideWidth: 400, minSlides: 2, maxSlides: 2, slideMargin: 10 }); }); </script> <div class="slider2"> <div class="slide"> <img src="http://placehold.it/350x150&text=FooBar1"> <img src="http://placehold.it/350x150&text=FooBar2"></div> <div class="slide"> <img src="http://placehold.it/350x150&text=FooBar3"> <img src="http://placehold.it/350x150&text=FooBar4"></div> <div class="slide"> <img src="http://placehold.it/350x150&text=FooBar5"> <img src="http://placehold.it/350x150&text=FooBar6"></div> <div class="slide"> <img src="http://placehold.it/350x150&text=FooBar7"> <img src="http://placehold.it/350x150&text=FooBar8"></div> <div class="slide"> <img src="http://placehold.it/350x150&text=FooBar9"> <img src="http://placehold.it/350x150&text=FooBar10"></div> </div> </div>



And here''s the code I''m applying to jquery slides to show 4 cells on each slide:

 <ul>
    <?php
        


这篇关于将PHP代码插入jQuery Slider时出现问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆