Vous n'êtes pas identifié(e).
13 février 2024 Sortie de Dotclear 2.29
Pages : 1
Bonjour,
Savez vous où se trouve l'appel aux fonctions du fichier nommé "noviny.js" du thème "noviny".
En effet, il y a des fonction dans le .js (le jQuery je pense) qui font marché l'affichage des tags et la recherche intégré du theme noviny.
Je voudrai m'essayé au jQuery pour faire des effets sur des images (effet de brillance quand on passe sur l'image par exemple etc.) mais j'arrive pas à savoir à quel endroit des fichiers html du thème on appel ces fonctions.
Si vous avez une tite idée. Merci à vous.
Hors ligne
J'essaye d'insérer des script à la main.
Pouvez vous m'indiquer si ce code insérer dans mon heder peut fonction ?
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function($){
$('#mega-menu-5').dcMegaMenu({
rowItems: '4',
speed: 'fast',
effect: 'fade'
});
});
</script>Hors ligne
As-tu regardé le fichier _top.html ? (pour l'appel du fichier js)
Hors ligne
Pouvez vous m'indiquer si ce code insérer dans mon heder peut fonction ?
Oui, tu peux l'insérer dans le fichier _head.html, mais sans la première ligne, l'appel à jQuery y est déjà normalement ;)
Hors ligne
Pour simplifier :
POUR LE SITE EN LIGNE :
- J'ai mis les codes .js dans le fichier .js de mon theme ( j'ai viré uniquement "(jQuery)" de fin de fichier puisqu'il y en avais déja un dans le .js de mon theme
- j'ai créé une page dans les tpl qui se nomme _annoneur.html
- J'ai gérer les chemin aux fichiers .css
Mais le menu ne marche toujours pas (voir le bas de mon site)
EN LOCAL, j'ai le même résultat erroné que sur mon site lorsque j'enlève la ligne suivante :
"<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>"
J'en déduit qu'en ligne, mon site n'interprete que les .css du menu mais pas les fonctions .js
... dommage; et je sais pas comment résoudre ce problème ...
Hors ligne
Voici le _head.html du theme avec mes modifs commentées, est ce que il y a des erreurs sur le javascript ou des probleme de compatibilité ?
<style type="text/css" media="screen">
@import url({{tpl:BlogThemeURL}}/style.css);
</style>
<style type="text/css" media="print">
@import url({{tpl:BlogThemeURL}}/../default/print.css);
</style>
<!-- css pour mon menu -->
<link rel="shortcut icon" type="image/x-icon" href="http://www.pressecologie.com/mini_logo/mini_logo.png"/>
<link href="http://www.pressecologie.com/themes/noviny/annonceurs.css" rel="stylesheet" type="text/css" />
<link href="http://www.pressecologie.com/themes/noviny/orange.css" rel="stylesheet" type="text/css" />
<!-- fonction du theme qui marche -->
<script type="text/javascript">
//<![CDATA[
window.onload = function() {
var current_domain = document.domain;
if (!current_domain || !document.getElementsByTagName) return;
var hrefels = new Array;
var hrefelslen = 0;
var hrefinner = '';
hrefels = document.getElementsByTagName("a");
hrefelslen = hrefels.length;
for (var i = 0; i < hrefelslen; i++) {
hrefinner = hrefels[i].innerHTML.toLowerCase();
if ( (hrefels[i].href == '') || (hrefels[i].href.indexOf('javascript') >=0 ) || (hrefinner.indexOf('<a') >= 0) || (hrefels[i].href.indexOf(current_domain) >= 0) || hrefels[i].onclick != null) {
continue;
}
hrefels[i].onclick = function () { window.open(this.href); return false; };
}
}
//]]>
</script>
<!-- fonction de mon menu -->
<script type="text/javascript">
$(document).ready(function($){
$('#mega-menu-5').dcMegaMenu({
rowItems: '4',
speed: 'fast',
effect: 'fade'
});
});
</script>
<!-- present par defaut dans le theme utilisé ... je pense que c'est les trucs de jQuery et fin de head-->
<script type="text/javascript" src="{{tpl:BlogThemeURL}}/../default/js/jquery.js"></script>
<script type="text/javascript" src="{{tpl:BlogThemeURL}}/../default/js/jquery.cookie.js"></script>
{{tpl:include src="user_head.html"}}
{{tpl:SysBehavior behavior="publicHeadContent"}}Merci bcp.
Hors ligne
Euh... là tu as inséré l'appel au script pour ton "megamenu", mais je ne vois pas la référence à un fichier javascript qui va traiter le code, ni à un fichier CSS pour le mettre en forme
Peux-tu nous dire d'où vient le script que tu essaies de mettre en place ?
Hors ligne
Pour mes css, j'ai ces deux fichiers. J'ai juste changer le chemin pour acceder aux images.
<link href="http://www.pressecologie.com/themes/noviny/annonceurs.css" rel="stylesheet" type="text/css" />
<link href="http://www.pressecologie.com/themes/noviny/orange.css" rel="stylesheet" type="text/css" />
Pour le javascript, je capte pas où c'est mais ça marche pour le thème ... donc j'ai collé le javascript récupéré dans ce meme fichier. (noviny.js) :
/* ANNONCEURS FONCTIONS BLOCK 1 ----------------------------------
* ------------------------------------------------------------ */
(function($){$.fn.hoverIntent=function(f,g){var cfg={sensitivity:7,interval:100,timeout:0};cfg=$.extend(cfg,g?{over:f,out:g}:f);var cX,cY,pX,pY;var track=function(ev){cX=ev.pageX;cY=ev.pageY;};var compare=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);if((Math.abs(pX-cX)+Math.abs(pY-cY))<cfg.sensitivity){$(ob).unbind("mousemove",track);ob.hoverIntent_s=1;return cfg.over.apply(ob,[ev]);}else{pX=cX;pY=cY;ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}};var delay=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);ob.hoverIntent_s=0;return cfg.out.apply(ob,[ev]);};var handleHover=function(e){var p=(e.type=="mouseover"?e.fromElement:e.toElement)||e.relatedTarget;while(p&&p!=this){try{p=p.parentNode;}catch(e){p=this;}}if(p==this){return false;}var ev=jQuery.extend({},e);var ob=this;if(ob.hoverIntent_t){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);}if(e.type=="mouseover"){pX=ev.pageX;pY=ev.pageY;$(ob).bind("mousemove",track);if(ob.hoverIntent_s!=1){ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}}else{$(ob).unbind("mousemove",track);if(ob.hoverIntent_s==1){ob.hoverIntent_t=setTimeout(function(){delay(ev,ob);},cfg.timeout);}}};return this.mouseover(handleHover).mouseout(handleHover);};});
/* ANNONCEURS FONCTIONS BLOCK 2 ----------------------------------
* ------------------------------------------------------------ */
(function($){
//define the defaults for the plugin and how to call it
$.fn.dcMegaMenu = function(options){
//set default options
var defaults = {
classParent: 'dc-mega',
rowItems: 3,
speed: 'fast',
effect: 'fade'
};
//call in the default otions
var options = $.extend(defaults, options);
var $dcMegaMenuObj = this;
//act upon the element that is passed into the design
return $dcMegaMenuObj.each(function(options){
megaSetup();
function megaOver(){
var subNav = $('.sub',this);
$(this).addClass('mega-hover');
if(defaults.effect == 'fade'){
$(subNav).fadeIn(defaults.speed);
}
if(defaults.effect == 'slide'){
$(subNav).slideDown(defaults.speed);
}
}
function megaOut(){
var subNav = $('.sub',this);
$(this).removeClass('mega-hover');
$(subNav).hide();
}
function megaSetup(){
$arrow = '<span class="dc-mega-icon"></span>';
var classParentLi = defaults.classParent+'-li';
var menuWidth = $($dcMegaMenuObj).outerWidth(true);
$('> li',$dcMegaMenuObj).each(function(){
//Set Width of sub
var mainSub = $('> ul',this);
var primaryLink = $('> a',this);
if($(mainSub).length > 0){
$(primaryLink).addClass(defaults.classParent).append($arrow);
$(mainSub).addClass('sub').wrap('<div class="sub-container" />');
// Get Position of Parent Item
var position = $(this).position();
parentLeft = position.left;
if($('ul',mainSub).length > 0){
$(this).addClass(classParentLi);
$('.sub-container',this).addClass('mega');
$('> li',mainSub).addClass('mega-hdr');
$('.mega-hdr > a').addClass('mega-hdr-a');
// Create Rows
var hdrs = $('.mega-hdr',this);
rowSize = parseInt(defaults.rowItems);
for(var i = 0; i < hdrs.length; i+=rowSize){
hdrs.slice(i, i+rowSize).wrapAll('<div class="row" />');
}
// Get Sub Dimensions & Set Row Height
$(mainSub).show();
// Calc Left Position of Sub Menu
// // Get Width of Parent
var parentWidth = $(this).width();
// // Calc Width of Sub Menu
var subWidth = $(mainSub).outerWidth(true);
var totalWidth = $(mainSub).parent('.sub-container').outerWidth(true);
var containerPad = totalWidth - subWidth;
var itemWidth = $('.mega-hdr',mainSub).outerWidth(true);
var rowItems = $('.row:eq(0) .mega-hdr',mainSub).length;
var innerItemWidth = itemWidth * rowItems;
var totalItemWidth = innerItemWidth + containerPad;
// Set mega header height
$('.row',this).each(function(){
$('.mega-hdr:last',this).addClass('last');
var maxValue = undefined;
$('.mega-hdr-a',this).each(function(){
var val = parseInt($(this).height());
if (maxValue === undefined || maxValue < val){
maxValue = val;
}
});
$('.mega-hdr-a',this).css('height',maxValue+'px');
$(this).css('width',innerItemWidth+'px');
});
// // Calc Required Left Margin
var marginLeft = (totalItemWidth - parentWidth)/2;
var subLeft = parentLeft - marginLeft;
// If Left Position Is Negative Set To Left Margin
if(subLeft < 0){
$('.sub-container',this).css('left','0');
} else {
$('.sub-container',this).css('left',parentLeft+'px').css('margin-left',-marginLeft+'px');
}
// Calculate Row Height
$('.row',mainSub).each(function(){
var rowHeight = $(this).height();
$('.mega-hdr',this).css('height',rowHeight+'px');
$(this).parent('.row').css('height',rowHeight+'px');
});
$(mainSub).hide();
} else {
$('.sub-container',this).addClass('non-mega').css('left',parentLeft+'px');
}
}
});
// Set position of mega dropdown to bottom of main menu
var menuHeight = $('> li > a',$dcMegaMenuObj).outerHeight(true);
$('.sub-container',$dcMegaMenuObj).css({top: menuHeight+'px'}).css('z-index','1000');
// HoverIntent Configuration
var config = {
sensitivity: 2, // number = sensitivity threshold (must be 1 or higher)
interval: 100, // number = milliseconds for onMouseOver polling interval
over: megaOver, // function = onMouseOver callback (REQUIRED)
timeout: 400, // number = milliseconds delay before onMouseOut
out: megaOut // function = onMouseOut callback (REQUIRED)
};
$('li',$dcMegaMenuObj).hoverIntent(config);
}
});
};
});
/* BEGIN LICENSE BLOCK 3 ----------------------------------
*
* This file is part of Noviny, a Dotclear 2 theme.
*
* Copyright (c) 2003-2008 Olivier Meunier and contributors
* Licensed under the GPL version 2.0 license.
* See LICENSE file or
* http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
*
* -- END LICENSE BLOCK --------------------------------- */
// Comment form display
$(function() {
if ($('body.dc-post, body.dc-page').length == 0) { return; }
if ($('#pr').length > 0) { return; }
var link = $('<a href="#">' + $('#comment-form h3:first').text() + '</a>').click(function() {
$('#comment-form fieldset:first').show(200);
$('#c_name').focus();
$(this).parent().removeClass('add-comment').html($(this).text());
return false;
});
$('#comment-form h3:first').empty().append(link).addClass('add-comment');
$('#comment-form fieldset:first').hide();
});
// Tags list display
$(function() {
var tags = $('#extra .tags li:has(a[class^=tag])').filter(function() {
var c = $('a',this).attr('class').substr(3);
return c <= 10; // We display only tags with % > 10
}).hide();
if (tags.length > 0) {
var all_tags = $('<a href="#">' + noviny.all_tags + '</a>').click(function() {
$('#extra .tags li:hidden').show().css('opacity',0.2).fadeTo(1600,1);
$('#extra .tags p').remove();
return false;
});
$('#extra .tags').append($('<p></p>').append(all_tags));
}
});
// Search suggest
$(function() {
$('#q').searchSuggest({
source: noviny.ajaxsearch,
forcePosition: {
position: 'absolute',
top: '20px',
left: 0
}
});
});
// Modified search suggest code from Peter Vulgaris (www.vulgarisoip.com)
(function($) {
$.searchSuggest = function(input,params) {
var defaults = {
source: null,
delay: 150,
minchars: 2,
selectClass: 'suggest-select',
maxCacheSize: 65536,
forcePosition: false
};
params = $.extend(defaults,params);
if (params.source == null) {
throw 'No source given';
}
input = $(input).attr("autocomplete", "off");
var results = $(document.createElement('div'));
var timeout = false; // hold timeout ID for suggestion results to appear
var prevLength = 0; // last recorded length of $input.val()
var cache = []; // cache MRU list
var cacheSize = 0; // size of cache in chars (bytes?)
results.attr('id','search-suggest').appendTo(input.parent()).hide();
resetPosition();
$(window).load(resetPosition).resize(resetPosition);
input.blur(function() {
setTimeout(hideList,100);
function hideList() {
results.hide('fast');
};
});
try {
results.bgIframe();
} catch (e) {}
if ($.browser.mozilla) {
input.keypress(processKey); // onkeypress repeats arrow keys in Mozilla/Opera
} else {
input.keydown(processKey); // onkeydown repeats arrow keys in IE/Safari
}
function hideList() {
results.hide('fast');
};
function resetPosition() {
var offset = input.offset();
if (!params.forcePosition) {
results.attr({
top: (offset.top + input.height()),
left: offset.left - input.width()
});
} else {
results.css(params.forcePosition);
}
};
function processKey(e) {
// handling up/down/escape requires results to be visible
// handling enter requires that AND a result to be selected
if ((/(27|38|40)$/.test(e.keyCode) && results.is(':visible')) || (e.keyCode == 13 && getCurrentResult()))
{
if (e.preventDefault)
e.preventDefault();
if (e.stopPropagation)
e.stopPropagation();
e.cancelBubble = true;
e.returnValue = false;
switch(e.keyCode) {
case 38: // up
prevResult();
break;
case 40: // down
nextResult();
break;
case 27: // escape
results.hide('fast');
break;
case 13: // return
document.location.href = $('a',getCurrentResult()).attr('href');
break;
}
}
else if (input.val().length != prevLength)
{
if (timeout)
clearTimeout(timeout);
timeout = setTimeout(suggest, params.delay);
prevLength = input.val().length;
}
};
function suggest() {
var q = $.trim(input.val());
if (q.length >= params.minchars) {
var cached = checkCache(q);
if (cached) {
displayItems(cached['data']);
} else {
$.get(params.source + q,function(data) {
displayItems(data);
addToCache(q,data,data.length);
});
}
} else {
results.hide('fast');
}
};
function checkCache(q) {
for (var i = 0; i < cache.length; i++) {
if (cache[i]['q'] == q) {
cache.unshift(cache.splice(i, 1)[0]);
return cache[0];
}
}
return false;
};
function addToCache(q,data,size) {
while (cache.length && (cacheSize + size > params.maxCacheSize)) {
var cached = cache.pop();
cacheSize -= cached['size'];
}
cache.push({
q: q,
size: size,
data: data
});
cacheSize += size;
};
function displayItems(data) {
if (data.length == 0) {
results.hide('fast');
return;
}
results.empty().append(data).show('fast');
$('li',results).mouseover(function() {
$('li',results).removeClass(params.selectClass);
$(this).addClass(params.selectClass);
});
};
function getCurrentResult() {
if (!results.is(':visible')) {
return false;
}
var res = $('li.'+params.selectClass,results);
if (res.length == 0) {
return false;
}
return res;
};
function nextResult() {
var res = getCurrentResult();
if (res) {
res.removeClass(params.selectClass).next().addClass(params.selectClass);
} else {
$('li:first-child',results).addClass(params.selectClass);
}
};
function prevResult() {
var res = getCurrentResult();
if (res) {
res.removeClass(params.selectClass).prev().addClass(params.selectClass);
} else {
$('li:last-child',results).addClass(params.selectClass);
}
};
};
$.fn.searchSuggest = function(params) {
this.each(function() {
new $.searchSuggest(this,params);
});
return this;
};
})(jQuery);La version de jQuery du menu c'est la 1.4.2 (j'espere que c'est bon).
La référence c'est ici que j'ai trouvé :
http://www.designchemical.com/lab/jquer … /download/
Si non voici le fichier noviny.js avec le code que j'ai ajouté :
Hors ligne
Avec firebug j'ai l'erreur
$ is not defined dans la ligne $(document).ready(function($){
essaie avec
<script type="text/javascript">
//<![CDATA[
$(document).ready( function () {
$('#mega-menu-5').dcMegaMenu({
rowItems: '4',
speed: 'fast',
effect: 'fade'
});
//]]>
</script>et surtout mets bien ce code APRES l'appel à jQuery ;)
Hors ligne
Est ce que l'appel à jQuery c'est ces lignes ?
<script type="text/javascript" src="{{tpl:BlogThemeURL}}/../default/js/jquery.js"></script>
<script type="text/javascript" src="{{tpl:BlogThemeURL}}/../default/js/jquery.cookie.js"></script>Si je place ces lignes avant ma fonction, jQuery du theme ne fonctionne plus du tout ... peut être que l'erreur viens de la syntaxe du fichier .js du coup :
<!-- fonction du theme qui marche -->
<script type="text/javascript">
//<![CDATA[
window.onload = function() {
var current_domain = document.domain;
if (!current_domain || !document.getElementsByTagName) return;
var hrefels = new Array;
var hrefelslen = 0;
var hrefinner = '';
hrefels = document.getElementsByTagName("a");
hrefelslen = hrefels.length;
for (var i = 0; i < hrefelslen; i++) {
hrefinner = hrefels[i].innerHTML.toLowerCase();
if ( (hrefels[i].href == '') || (hrefels[i].href.indexOf('javascript') >=0 ) || (hrefinner.indexOf('<a') >= 0) || (hrefels[i].href.indexOf(current_domain) >= 0) || hrefels[i].onclick != null) {
continue;
}
hrefels[i].onclick = function () { window.open(this.href); return false; };
}
}
//]]>
</script>
<!-- present par defaut dans le theme utilisé ... je pense que c'est les trucs de jQuery et fin de head-->
<script type="text/javascript" src="{{tpl:BlogThemeURL}}/../default/js/jquery.js"></script>
<script type="text/javascript" src="{{tpl:BlogThemeURL}}/../default/js/jquery.cookie.js"></script>
<!-- fonction de mon menu -->
<script type="text/javascript">
//<![CDATA[
$(document).ready(function($){
$('#mega-menu-5').dcMegaMenu({
rowItems: '4',
speed: 'fast',
effect: 'fade'
});
});
//]]>
</script>
{{tpl:include src="user_head.html"}}
{{tpl:SysBehavior behavior="publicHeadContent"}}Si je place ces ligne après, le jQuery du theme qui fonctionne... D'ailleur je peux supprimer la fonction, ça change rien.
Une idée ? :-)
Hors ligne
Ben là le menu du bas de page fonctionne...
Hors ligne
Super tip top ça marche :-) ...
Désolé de ne pas avoir prévenu plus tôt, j'ai eu des coupures de courant ...he ouai j'habite "la ravine des cabris" et c'est pas le bastion du monde numérique..
Pour info :
- Ne pas enlever les balise (jQuery) apres les fonctions !!!
- Mettre le code jQuery après les balises
<script type="text/javascript" src="{{tpl:BlogThemeURL}}/../default/js/jquery.js"></script>
<script type="text/javascript" src="{{tpl:BlogThemeURL}}/../default/js/jquery.cookie.js"></script>- Formater la fonction avec :
//<![CDATA[
puis
//]]>Amusez vous bien parce que le jQuery c'est bien foutu quand même !!! et vive dotclear !!!
Bonne soirée à tous
Hors ligne
Pages : 1
Vous n'êtes pas identifié(e).