2013-07-11 19 views
8

Come impostare manualmente il valore predefinito in twitter bootstrap 2 e twitter bootstrap 3?Come posso impostare valori di proprietà predefiniti per il popover di bootstrap di Twitter?

Ho il seguente codice, è possibile visualizzare le stesse proprietà nelle opzioni utilizzate di nuovo (devo sovrascriverli perché devono essere diversi dai valori predefiniti).

Le tre proprietà utilizzate più volte sono triggerplacement & html.

Come posso sovrascrivere le opzioni predefinite impostate da twitter bootstrap nel mio javascript?

Javascript(On DOM pronto)

$('.pop1').popover({ 
    trigger: 'hover', 
    placement : 'right', 
    html: true, // used once (and the 2 above) 
    title : 'My title for popover1', 
    content : 'My content with popover1' 
}); 

$('.pop2').popover({ 
    trigger: 'hover', //used again 
    placement : 'right', 
    html: true, 
    title : 'My title for popover2', 
    content : 'My content with popover2' 
}); 

$('.pop3').popover({ 
    trigger: 'hover', //and again! 
    placement : 'right', 
    html: true, 
    title : 'My title for popover3', 
    content : 'My content with popover3' 
}); 

HTML:

<span class="pop1"><i class="icon-info-sign"></i></span> 
<span class="pop2"><i class="icon-info-sign"></i></span> 
<span class="pop3"><i class="icon-info-sign"></i></span> 

Volevo qualcosa come validatori jQuery (& altri plugin): jQuery.validator.setDefaults()

Quindi, in pratica, come posso impostare i valori predefiniti di bootstrap per twitter bootstrap 2 e twitter bootstrap 3 ?, mi piacerebbe che bootstrap utilizzasse i miei valori predefiniti personalizzati quindi non devo sovrascriverli più e più volte attraverso il mio codice , Come posso personalizzarlo in modo che il valore predefinito sia specificato da me e non da Twitter Bootstrap 2 o Twitter Bootstrap 3.

risposta

20

Bootstrap V2 - View the JSFiddle

è possibile accedere alla defaults per vedere tutti i valori predefiniti impostati dal Bootstrap 2 utilizzando:

console.log($.fn.popover.defaults); // Log default values to the console 

È possibile sovrascrivere i valori predefiniti impostati da Twitter Bootstrap 2 utilizzando la seguente :

// Make sure jQuery is loaded before trying to override the defaults! 
$.fn.popover.defaults.trigger = 'hover'; // Set the default trigger to hover 
$.fn.popover.defaults.placement = 'right'; // Set the default placement to right 
$.fn.popover.defaults.html = true;   // Set the default html (parse html) to true 

View the JSFiddle here


Bootstrap V3 - View the JSFiddle

È possibile registrare il defaults per vedere tutti i valori predefiniti impostati dal Bootstrap 3 utilizzando:

console.log($.fn.popover.Constructor.DEFAULTS); // Log default values to the console 

È possibile sovrascrivere i valori predefiniti impostati da Twitter Bootstrap 3 utilizzando il seguente:

// Make sure jQuery is loaded before trying to override the defaults! 
$.fn.popover.Constructor.DEFAULTS.trigger = 'hover'; // Set the default trigger to hover 
$.fn.popover.Constructor.DEFAULTS.placement = 'right'; // Set the default placement to right 
$.fn.popover.Constructor.DEFAULTS.html = true;   // Set the default html (parse html) to true 

View the JSFiddle here


valori predefiniti

Per impostazione predefinita i valori sono impostati al seguente (sono gli stessi in bootstarp 2 & 3):

animation: true 
container: false 
content: "" 
delay: 0 
html: false 
placement: "right" 
selector: false 
template: "<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>" 
title: "" 
trigger: "hover" 
+0

FYI, questo sembra funzionare non più in Bootstrap 3 :( –

+0

è possibile utilizzare '$ .fn.popover.Constructor.DEFAULTS' con Bootstrap 3 – zazabe

+1

La versione BS3 funziona come un fascino! Grazie. – kernel

Problemi correlati