Hola a tod@s, estoy siguiendo unos tutoriales y quiero poner en una web dos elementos:
- Un slider y debajo unos botones de control
- Que el menú sea responsive.
El problema es que en los dos tutoriales me dan un main.js y si los pongo juntos, aunque renombre uno de ellos se anulan los dos. No alcanzo a entender porque es y por eso necesito de vuestra sabia ayuda.
Alguien me puede ayudar? Como puedo unir los dos main para que no se anulen entre ellos? Gracias de antemano.
Os dejo los dos js:
El del menú responsive:
// Responsive Menu
var $j = jQuery.noConflict();
$j(function () {
$j('#cssmenu').slicknav();
});
var $optionSets = $j('#portfolio .folio-filter'),
$optionLinks = $optionSets.find('a');
$optionLinks.click(function(){
var $this = $j(this);
// don't proceed if already selected
if ( $this.hasClass('selected') ) {
return false;
}
var $optionSet = $this.parents('.folio-filter');
$optionSet.find('.selected').removeClass('selected ');
$this.addClass('selected');
// make option object dynamically, i.e. { filter: '.my-filter-class' }
var options = {},
key = $optionSet.attr('data-option-key'),
value = $this.attr('data-option-value');
// parse 'false' as false boolean
value = value === 'false' ? false : value;
options[ key ] = value;
if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' ) {
changeLayoutMode( $this, options );
} else {
// otherwise, apply new options
$container.isotope( options );
}
return false;
});
}
});
$j(window).bind('resize', function(e){
window.RT = setTimeout(function() {$j('#folio').isotope('reLayout'); }, 800);
});
Y aquí el del Slider:
/**
* Titulo: Crear un slider
$(function() {
var SliderModule = (function() {
var pb = {};
pb.el = $('#slider');
pb.items = {
panel: pb.el.find('li')
}
// Variables Necesarias
var SliderInterval,
currentSlider = 0,
nextSlider = 1,
lengthSlider = pb.items.panel.length;
// Funcion para controles del slider
var changePanel = function(id) {
clearInterval(SliderInterval);
var panels = pb.items.panel,
controls = $('#slider-controls li');
// Comprobamos el ID
if (id >= lengthSlider) {
id = 0;
} else if (id < 0) {
id = lengthSlider-1;
}
// Efectos
controls.removeClass('active').eq(id).addClass('ac tive');
panels.eq(currentSlider).fadeOut('slow');
panels.eq(id).fadeIn('slow');
// Actualizamos nuestros datos
currentSlider = id;
nextSlider = id+1;
// Reactivamos el slider
SliderInit();
}
return pb;
}());
SliderModule.init({duration: 4000});
});
