Hi! I have a Jquery slider plugin on my website called Nivo-Slider. I’m having two separate issues with it and I was hoping to get help with both or just one of them.
First, the slider doesn’t load at all on IE 8 or 9. I believe the problem arises from having another plugin that handles my navigation. When I delete the navigation plugin, the slider loads. This doesn’t happen on IE11, chrome or Firefox. With these browsers both plugins load together with no problem.
The other problem I have is similar. On another page, I have a map plugin called maplace. The plugin will not load on any browser in the presence of Nivo Slider. When I get rid of the slider the maps show up just fine.
So in summary, I have two different pages. On one of them, the slider doesn’t load for IE8 and IE9. On the other page, the maps plugin doesn’t load (for any browser) when the slider is there.
Here is the code for my Nivo Slider plugin:
<script type="text/javascript">
$(function() {
$('#slider').nivoSlider({directionNav: false, controlNav: false, controlNavThumbs: false});});
</script>
Here is the HTML markup:
<div id="wrapper">
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<img src="images/slide-1.png" />
<img src="images/slide-2.png" />
</div>
</div>
Here is the navigation plugin that conflicts on IE8 and IE9:
<script type="text/javascript">
/***********************************************
* Dynamic Ajax Content- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
var bustcachevar=1 //bust potential caching of external pages after initial request? (1=yes, 0=no)
var loadedobjects=""
var rootdomain="http://"+window.location.hostname
var bustcacheparameter=""
function ajaxpage(url, containerid){
var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request, containerid)
}
if (bustcachevar) //if bust caching of external page
bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
page_request.open('GET', url+bustcacheparameter, true)
page_request.send(null)
}
function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText
}
function loadobjs(){
if (!document.getElementById)
return
for (i=0; i<arguments.length; i++){
var file=arguments[i]
var fileref=""
if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
if (file.indexOf(".js")!=-1){ //If object is a js file
fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", file);
}
else if (file.indexOf(".css")!=-1){ //If object is a css file
fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", file);
}
}
if (fileref!=""){
document.getElementsByTagName("head").item(0).appendChild(fileref)
loadedobjects+=file+" " //Remember this object as being already added to page
}
}
}
</script>
And here is the html markup for it:
<ul id="menu" >
<li><a href="javascript:ajaxpage('home.html', 'contentarea');" class="home"></a></li>
<li><a href="javascript:ajaxpage('aboutus.html', 'contentarea');" class="aboutus"></a></li>
<li><a href="javascript:ajaxpage('newcustomer.html', 'contentarea');" class="newcustomer"></a></li>
<li><a href="javascript:ajaxpage('electronicordering.html', 'contentarea');" class="electronicordering"></a></li>
<li><a href="javascript:ajaxpage('links.html', 'contentarea');" class="links"></a></li>
<li><a href="javascript:ajaxpage('forms.html', 'contentarea');" class="forms"></a></li>
<li><a href="javascript:ajaxpage('contactus.html', 'contentarea');" class="contactus"></a></li>
</ul>
Lastly, here is the code for maps plugin:
<script type="text/javascript">
new Maplace({
locations: [
{
lat: 33.8583,
lon: -117.8678,
title: 'Anaheim',
html: [
'<h3>Anaheim</h3>',
'<p>1361 N RedGum St, Anaheim CA 92806<br>(714) 630-5954</p>'
].join(''),
zoom: 8
},
{
lat: 34.2358,
lon: -118.5739,
title: 'Chatsworth',
html: [
'<h3>Chatsworth</h3>',
'<p>20233 Corisco St, Chatsworth CA 91311<br>(818) 998-3001</p>'
].join(''),
zoom: 8
},
{
lat: 32.8142,
lon: -117.1247,
title: 'San Diego',
html: [
'<h3>San Diego</h3>',
'<p>4000 Ruffin Road Suite K, San Diego CA 92123<br>(858) 292-1622</p>'
].join(''),
zoom: 8
}
,
{
lat: 34.9137,
lon: -120.4632,
title: 'Santa Maria',
html: [
'<h3>Santa Maria</h3>',
'<p>1459 W. Fairway Dr., Santa Maria CA 93455<br>(805) 922-4445</p>'
].join(''),
zoom: 8
}
,
{
lat: 34.5011,
lon: -117.3279,
title: 'Victorville',
html: [
'<h3>Victorville</h3>',
'<p>15400-B Tamarack Road, Victorville CA 92392<br>(760) 243-5666</p>'
].join(''),
zoom: 8
}
,
{
lat: 36.1605,
lon: -115.1050,
title: 'Las Vegas',
html: [
'<h3>Las Vegas</h3>',
'<p>3101 Builders Ave., Las Vegas, NV 89101<br>(702) 452-2440</p>'
].join(''),
zoom: 8
}
,
{
lat: 33.1677,
lon: -117.2202,
title: 'Vista',
html: [
'<h3>Vista</h3>',
'<p>2055 Thibodo Rd, Vista CA 92081<br>(760) 599-0791</p>'
].join(''),
zoom: 8
}
,
{
lat: 33.6224,
lon: -117.7194,
title: 'Laguna Hills',
html: [
'<h3>Laguna Hills</h3>',
'<p>23561 Ridge Route Suite P, Laguna Hills CA 92653<br>(949) 699-3308</p>'
].join(''),
zoom: 8
}
,
{
lat: 34.4245,
lon: -118.4998,
title: 'Santa Clarita',
html: [
'<h3>Santa Clarita</h3>',
'<p>26846 Oak Ave Unit R, Santa Clarita CA 91315<br>(661) 424-9396</p>'
].join(''),
zoom: 8
}
],
map_div: '#gmap-list',
controls_type: 'list',
controls_title: 'Choose a location:'
}).Load();
</script>
And here is its HTML markup:
<div id="gmap-dropdown"></div>
<div id="gmap-list" class="gmap"></div>
I recognize this is probably a lot of code to look at, but I have been pulling my hair for days with this one. Any feedback would be appreciated. Let me know if you need more info.
Thanks!
