Click here to Skip to main content
15,889,867 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hi,

I am using on javascript for simple image slider on page.
But now i have to show popup on page load for that i used another one js file.
Because of Popup js file my slider not working.
I placed the popup js file on different position but it wont working.
Can anyone tell me what should i do to avoid this problem.
Waiting for your useful replies....


When I placed this js,

<script type="text/javascript" src="http://www.xyz.com/js/jquery-latest.js"></script>
popup works but slider script not working and when I remove it popup not working and slider works ...



THanx in Advance ..




ASP.NET
<link href='http://fonts.googleapis.com/css?family=Droid+Serif' rel='stylesheet' type='text/css' />
<!--Home page slide show start -->
<link rel="stylesheet" type="text/css" href="http://www.xyz.com/style/slideshow.css" />
<script type="text/javascript" src="http://www.xyz.com/js/slideshow_slider_jquery.js"></script>
<script type="text/javascript" src="http://www.xyz.com/js/slideshow_slider_a.js"></script>
<script type="text/javascript" src="http://www.xyz.com/js/jquery-latest.js"></script>
<!--<script type="text/javascript" src="js/js1.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>-->
<script type="text/javascript" src="http://www.xyz.com/js/popup.js"></script>
<!--Home page slide show end -->

<!--script for onclick images start -->
<link rel="stylesheet" type="text/css" href="http://www.xyz.com/style/autoscroll-gallery-skin.css" />


<!--script for onclick images end-->

  <script type="text/javascript">
      function popuponload() {
          $("#btn_interstpopoup").PerchhPopUp($("#popup_background2"), $("#popup_panel2"), $("#popup_close2"));
          $("#btn_interstpopoup").click();
      }

        function firstclick() {
               
                $("#second").fadeIn({ 'height': '235px' }, "fast", function () { });
                $("#first").hide();
        }

        function secondclick() {


            $("#first").fadeIn({ 'height': '118px' }, "fast", function () { });
            $("#second").hide();
        }



        $(document).ready(function () {
            $("#second").hide();
            $("#first").show();

            popuponload();

            $('select.drop_down5').each(function () {
                var title = $(this).attr('title');
                if ($('option:selected', this).val() != '') title = $('option:selected', this).text();
                $(this)
                .css({ 'z-index': 10, 'opacity': 0, '-khtml-appearance': 'none' })
                .after('<span class="drop_down5">' + title + '</span>')
                .change(function () {
                    val = $('option:selected', this).text();
                    $(this).next().text(val);
                })
            });
          



        });
</script>
<script type="text/javascript" src="http://www.xyz.com/js/autoscroll-gallery-jquery.js"></script>
<script type="text/javascript">
        function mycarousel_initCallback(carousel) {
            // Disable autoscrolling if the user clicks the prev or next button.
            carousel.buttonNext.bind('click', function () {
                carousel.startAuto(0);
            });

            carousel.buttonPrev.bind('click', function () {
                carousel.startAuto(0);
            });

            // Pause autoscrolling if the user moves with the cursor over the clip.
            carousel.clip.hover(function () {
                carousel.stopAuto();
            }, function () {
                carousel.startAuto();
            });
        };

        $(document).ready(function () {
            $('#mycarousel').jcarousel({
                auto: 0, //if you give 1 nuber it will automatic run//
                wrap: 'last',
                initCallback: mycarousel_initCallback
            });
        });

</script>

</head>

<body>
<form id="main_form" runat="server" >
 
 <%--Popup Start--%>
  <div id="btn_interstpopoup" ></div>    
    <div id="popup_background2" class="popup_background" style="opacity: 0;display:none; "></div>
 <div id="popup_panel2" class="popup_panel" style="margin-removed 0px; opacity: 0; display: none; height:400px;">
        <div class="popup_wrapper">
            <div id="popup_header2" class="popup_header" style="color: #237bb4;font-size: 22px;">
               <div style=" margin-removed85px;">
                Involvo wins a lawsuit against Rolf Graeser
                </div>
                <div id="popup_close2" class="popup_close"></div>
            </div>
            <div style="margin: 30px 20px;line-height: 30px;height: 140px;font-size: 18px;">
                <div>
                    <div>
                        <div id="divInterestList" style="width:600px;height: 350px; text-align: justify;">
                        
                        The President of the Court in Bremgarten, Switzerland has upheld the lawsuit against Rolf Graeser in favor of Involvo Wrapping Solutions AG.The court has prohibited Rolf Graeser , company Involdes AG and as any third party from offering maintenance activities or supplying spare parts for Invopac & Invospeed machines, for customers of xyz machines. For copy of court order, please 
                        <span style="color:#237bb4; text-decoration:none; removed :pointer ;"><a href="http://xyz.com/images/pdf/xyz Verdict.pdf" target="_blank" style=" text-decoration :none;color:#237bb4; text-decoration:none; removed :pointer ;" class="detail-text">click here</a></span> <br /><br />
xyz Wrapping Solutions, as always, will strive for customer delight. Please feel free to write or contact us at <span><a href="mailto:info@xyz.com" style=" text-decoration :none;color:#237bb4; text-decoration:none; removed :pointer; " class="email">info@xyz.com</a></span>          

                          
                        </div>
                        
                        <div class="clr"></div>
                    </div>
                </div>
            </div>
        </div>
        </div>
  <%--Popup End--%>

<asp:SqlDataSource runat="server" ID="prod_gallery_home" SelectCommand="GetAllProductGallery" 
        SelectCommandType="StoredProcedure" ConnectionString="<%$ ConnectionStrings:con %>" >
<SelectParameters>
<asp:Parameter Name="Mode" Type="String" DefaultValue ="Eng"  />
</SelectParameters>

</asp:SqlDataSource>

<div class="wrap">
<div class="header">
	<div>
              <uc3:navigation ID="Navigation1"  runat="server" />
                    
	</div>				
           
           <div id="wowslider-container">
	<div id="wowslider-images">
<img style="position: absolute; visibility: visible; display: block;" src="images/Food_packaging_equipments.jpg" alt="Food Packaging Equipments" title="Food Packaging Equipments" id="wows0" width="960" height="316">
<img style="position: absolute; display: none; visibility: visible;" src="images/Product_packaging_machines.jpg" alt="Product Packaging Machines" title="Product Packaging Machines" id="wows1" width="960" height="316">
<img style="position: absolute; display: none; visibility: visible;" src="images/Shrink_wrapper.jpg" id="wows2" alt="Shrink Wrapper" title="Shrink Wrapper" width="960" height="316">
<img style="position: absolute; display: none; visibility: visible;" src="images/Product_Packaging.jpg" id="wows3" alt="Product Packaging" title="Product Packaging" width="960" height="316">
</div>
<div class="ws_bullets">
  <h3><a class="ws_selbull" href="#wows0">1</a>
      <a class="ws_selbull" href="#wows1">2</a>
      <a class="ws_selbull" href="#wows2">3</a>
      <a class="ws_selbull" href="#wows3">4</a> 
  </h3>
</div>
</div><!-- End WOWSlider.com BODY section -->         
        
					
					<div><img src="images/banner-glow.jpg" border="0" /></div>
			</div></div>
			
			<div class="wrap-1">
				<div class="middle-container">
					<div class="middle-container-left">
					<div class="h1">About xyz</div>
					<div class="detail-text">
					xyz is amongst the pioneers in wrap around case packing and high speed shrink wrapping. The leader in the packaging industry for over 4 decades, xyz serves many customers across the globe, cutting through various industries, with a focus on Food & Beverages, Personal & Home care sectors.
                    <br />Some of the world's best brands use our wrap around case packer and shrink wrappers.<br />
                        xyz is growing on the back of its reliable machines and our active agents. We have active sales agents and well trained service personnel across Europe, America, Asia and Australia.
                    <a href="http://www.xyz.com/AboutUs" style="color:#237bb4; text-decoration:none;" >Read More... 
                    <%--<img border="0" title="Read More" alt="Read more" src="images/readmore-arrow.png" />--%></a></div>
					</div>
					
			<!--Right Cost Saving start -->
			<div>                
                <uc4:right_nav ID="Right_nav1"  runat="server" />                					
			</div>
			<!--Right Cost Saving end -->				
					
					
					<div class="clr"></div>
					<div style="padding-removed20px; padding-removed10px; width:960px;">
				    <div id="pdf" style="float:left; width:455px; vertical-align:middle; padding:5px; font-family:Georgia;	font-size:12px;	color:HighlightText #858484 ; text-decoration:none; line-height:24px;	font-weight:normal;	text-align:justify;">
							<%--<div class="h2">The <br /> Gallery</div><br />--%>
                            <div id="first" class="pdf"  önclick="firstclick();">
                            <div style="text-align:center; color :#237bb4; font-size :16px;" >Involvo wins a lawsuit against Rolf Graeser</div>
                            <div style=" padding :5px">
The President of the Court in Bremgarten, Switzerland has upheld the lawsuit against Rolf Graeser in favor of Involvo Wrapping Solutions AG.The court has prohibited Rolf Graeser , company Involdes AG and .....     <span id = "more" style =" removed :pointer ; color:#237bb4; text-decoration:none;"  >more</span>
                            </div>
                            </div> 

                            <div id="second" class="pdf"  önclick="secondclick();">
                            <div style="text-align:center; color :#237bb4;  font-size :16px;" >Involvo wins a lawsuit against Rolf Graeser</div>
                            <div style=" padding :5px">
The President of the Court in Bremgarten, Switzerland has upheld the lawsuit against Rolf Graeser in favor of xyz Wrapping Solutions AG.The court has prohibited Rolf Graeser , company Involdes AG and as any third party from offering maintenance activities or supplying spare parts for Invopac & Invospeed machines, for customers of xyz machines.  For copy of court order, please 
<span style="color:#237bb4; text-decoration:none; removed :pointer ;"><a href="http://xyz.com/images/pdf/xyz Verdict.pdf" target="_blank" style =" text-decoration :none;color:#237bb4; text-decoration:none; removed :pointer ;" class="detail-text">click here</a></span>
                            <br />xyz Wrapping Solutions, as always, will strive for customer delight. Please feel free to write or contact us at 
                            <span><a href="mailto:info@xyz.com" style =" text-decoration :none;color:#237bb4; text-decoration:none; removed :pointer; " class="email">info@xyz.com</a></span> 
         
<span id = "less" style =" removed :pointer ; color:#237bb4; text-decoration:none; float :right ; margin-removed35px;" >less</span>                             </div>
                             </div>
							<!--<div class="view-all-text">View All ></div>-->
					</div>
					<div style="float:right; witdth:680px;">
							
                            <div style="padding:0px 0 15px 0; float:left;"> <!--image slider start-->
								<div class=" jcarousel-skin-tango"><div style="removed: relative; display: block;" class="jcarousel-container jcarousel-container-horizontal">
								  <div style="removed: relative; width:490px; margin-removed0px;" class="jcarousel-clip jcarousel-clip-horizontal">
                                    <ul style="overflow: hidden; removed: relative; removed 0px; margin: 0px; padding: 0px; removed 0px; width: 200px; height:120px;" id="mycarousel" class="jcarousel-list jcarousel-list-horizontal">
                                    
                                    <asp:Repeater id="rep_homegall" DataSourceID="prod_gallery_home" runat="server" >
                                    <ItemTemplate>
                                     <li jcarouselindex="1" style="float: left; list-style: none outside none;" class="jcarousel-item jcarousel-item-horizontal jcarousel-item-1 jcarousel-item-1-horizontal">
                                        <div class="homeroundbg">
                                          <div class="homeroundimage"><img src="sp_ad/images/product/prod_images/<%# Eval("photo_name") %>" alt="<%# Eval("description") %>" title="<%# Eval("description") %>" border="0" width="118" height="85"/></div>
                                        </div>
                                        <!--roundbg close-->
                                      </li>
                                    </ItemTemplate>
                                    </asp:Repeater>                          
                                                                         
                                    </ul>
							      </div>
								  <div disabled="true" style="display:block;" class="jcarousel-prev jcarousel-prev-horizontal jcarousel-prev-disabled jcarousel-prev-disabled-horizontal"></div>
								  <div disabled="false" style="display: block;" class="jcarousel-next jcarousel-next-horizontal"></div>
								</div></div>
	</div><!--image slider end-->
                            
						</div>
						<div class="clr"></div>
					</div>
					
				</div><!--middle container close-->
			</div><!--wrap1 close-->
			
			<div>
            
            <uc2:footer ID="Footer1"  runat="server" />
                
			</div>
			
<script type="text/javascript" src="http://www.involvo.com/js/slideshow_slider_script.js"></script>

<script type="text/javascript">

    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-33999124-1']);
    _gaq.push(['_trackPageview']);

    (function () {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();

</script>

</form>
</body>
</html>
Posted
Updated 12-Apr-13 1:16am
v2
Comments
Mohibur Rashid 12-Apr-13 3:04am    
Use the right code that wont conflict with each other. try to define function that does not overwrite current function
Abhinav S 12-Apr-13 3:22am    
Post the code here. Maybe someone can help.
kishore sharma 12-Apr-13 5:03am    
Hi can you put your script function and links to jquery files .
faisal23 12-Apr-13 7:17am    
Hi i update my question and add code in it please see it.

1 solution

Millettech is growing web design company located in shanghai. We work with clients from all over the world and thrive on bringing our innovation, speed and efficiency to out client and their projects.

Jason zhang
phone: +86-021-68880576
msn: millettech@hotmail.com
skype: www.millettech.com
e-mail: info@millettech.com
 
Share this answer
 
Comments
kishore sharma 12-Apr-13 3:22am    
what is this stuff here...............
faisal23 12-Apr-13 3:27am    
I don't know?
_Amy 12-Apr-13 3:35am    
It's spam.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900