Visualizzazione risultati 1 fino 2 di 2

Discussione: Jquery Fade Header

  1. 13-01-2014, 09.59.52 #1
    yoshiitaly
    yoshiitaly non è connesso Neofita
    Data registrazione
    03-12-2013
    Messaggi
    21

    Predefinito Jquery Fade Header

    Ciao a tutti o provato a fare questa istallazione di mods che a un totale di tempo cambia header va be sarebbe il LOGO sopra al forum la mods funziona perfettamente unico problema che riscontro e su altri browser mozilla e perfetta ma google chrome e opera mi escono le immagini che alla fine co una riga in mezzo e sembra riniziare l'immagine dall'inizio potete aiutarmi a capire dove sta il problema grazie incollo la mods qui

    Apri:
    styles/prosilver/template/overall_header.html

    trova:
    Codice HTML:
    </head>
    aggiungi prima:
    Codice HTML:
    <!--fade-header by Slash www.wiizard.it-->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
        <script language="JavaScript" type="text/javascript">
        $(document).ready(function(){
                   
                    var imgArr = new Array( // path immagini
                       '{T_THEME_PATH}/images/bgheader.gif',
                            '{T_THEME_PATH}/images/bgheader1.gif',
                            '{T_THEME_PATH}/images/bgheader2.gif'
                       );
                       
                    var preloadArr = new Array();
                    var i;
                   
                    /* preload immagini*/
                    for(i=0; i < imgArr.length; i++){
                       preloadArr[i] = new Image();
                       preloadArr[i].src = imgArr[i];
                    }
                   
                    var currImg = 1;
                    var intID = setInterval(changeImg, 60000); // l' immagine cambia ogni: in millisecondi /
                   
                    function changeImg(){
                       $('.headerbar').animate({opacity: 0}, 1, function(){
                          $(this).css('background','url(' + preloadArr[currImg++%preloadArr.length].src +')');
                       }).animate({opacity: 1}, 1000);
                    }
         
                 });
        </script>
        <!--fade-header by Slash www.wiizard.it-->
    se hai gia incluso Jquery elimina questa linea:
    Codice HTML:
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    modifica il seguente codice per aggiungere nuove immagini al tuo header:
    Codice HTML:
        '{T_THEME_PATH}/images/bgheader.gif',
                            '{T_THEME_PATH}/images/bgheader1.gif',
                            '{T_THEME_PATH}/images/bgheader2.gif'
    ricordati di non inserire la virgola dopo l' ultima immagine.

    infine vuota la cache.
    questa linea regola i tempi di cambiamento velocità

    Codice HTML:
        var intID = setInterval(changeImg, 60000); // l' immagine cambia ogni: in millisecondi /
    apri common.css

    trova:
    Codice HTML:
        .headerbar {
       background: #ebebeb none repeat-x 0 0;
       color: #FFFFFF;
       margin-bottom: 4px;
       padding: 0 5px;
    }
    sostituisci:
    Codice HTML:
       .headerbar {
       background: #ebebeb none repeat-x 0 0;
       color: #FFFFFF;
       margin-bottom: 4px;
       height: 143px;
    }
    modifica i parametri dell'altezza : height: 143px; con la misura a tuo piacere



    Note tutto quello che ho fatto sarebbe il file originale non so perchè su mozilla va bene e su altri browser no ripeto mi da le immagini come forsero tagliate alla fine dell'logo dove sta la casella di ricerca alla destra
  2. 13-01-2014, 10.10.30 #2
    yoshiitaly
    yoshiitaly non è connesso Neofita
    Data registrazione
    03-12-2013
    Messaggi
    21

    Predefinito

    bene ora allego il file quello che ho inserito in overall_header

    Codice HTML:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
<head>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="{S_USER_LANG}" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="resource-type" content="document" />
<meta name="distribution" content="global" />
<meta name="keywords" content="" />
<meta name="description" content="" />
{META}

<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>
<!-- IF FAVICON --><link rel="shortcut icon" href="{ROOT_PATH}{FAVICON}" type="image/x-icon" /><!-- ENDIF -->

<!-- IF S_ENABLE_FEEDS -->
	<!-- IF S_ENABLE_FEEDS_OVERALL --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {SITENAME}" href="{U_FEED}" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_NEWS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_NEWS}" href="{U_FEED}?mode=news" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_FORUMS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_ALL_FORUMS}" href="{U_FEED}?mode=forums" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPICS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_TOPICS_NEW}" href="{U_FEED}?mode=topics" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPICS_ACTIVE --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_TOPICS_ACTIVE}" href="{U_FEED}?mode=topics_active" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_FORUM and S_FORUM_ID --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FORUM} - {FORUM_NAME}" href="{U_FEED}?f={S_FORUM_ID}" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPIC and S_TOPIC_ID --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_TOPIC} - {TOPIC_TITLE}" href="{U_FEED}?f={S_FORUM_ID}&amp;t={S_TOPIC_ID}" /><!-- ENDIF -->
<!-- ENDIF -->

<!--
	phpBB style name: prosilver
	Based on style:   prosilver (this is the default phpBB3 style)
	Original author:  Tom Beddard ( http://www.subBlue.com/ )
	Modified by: 
--> <![CDATA[

	var jump_page = '{LA_JUMP_PAGE}:';
	var on_page = '{ON_PAGE}';
	var per_page = '{PER_PAGE}';
	var base_url = '{A_BASE_URL}';
	var style_cookie = 'phpBBstyle';
	var style_cookie_settings = '{A_COOKIE_SETTINGS}';
	var onload_functions = new Array();
	var onunload_functions = new Array();

	<!-- IF S_USER_PM_POPUP and S_NEW_PM -->
		var url = '{UA_POPUP_PM}';
		window.open(url.replace(/&amp;/g, '&'), '_phpbbprivmsg', 'height=225,resizable=yes,scrollbars=yes, width=400');
	<!-- ENDIF -->

	/**
	* Find a member
	*/
	function find_username(url)
	{
		popup(url, 760, 570, '_usersearch');
		return false;
	}

	/**
	* New function for handling multiple calls to window.onload and window.unload by pentapenguin
	*/
	window.onload = function()
	{
		for (var i = 0; i < onload_functions.length; i++)
		{
			eval(onload_functions[i]);
		}
	};

	window.onunload = function()
	{
		for (var i = 0; i < onunload_functions.length; i++)
		{
			eval(onunload_functions[i]);
		}
	};

// ]]>
</script>
<script type="text/javascript" src="{T_SUPER_TEMPLATE_PATH}/styleswitcher.js"></script>
<script type="text/javascript" src="{T_SUPER_TEMPLATE_PATH}/forum_fn.js"></script>

<link href="{T_THEME_PATH}/print.css" rel="stylesheet" type="text/css" media="print" title="printonly" />
<link href="{T_STYLESHEET_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />

<link href="{T_THEME_PATH}/normal.css" rel="stylesheet" type="text/css" title="A" />
<link href="{T_THEME_PATH}/medium.css" rel="alternate stylesheet" type="text/css" title="A+" />
<link href="{T_THEME_PATH}/large.css" rel="alternate stylesheet" type="text/css" title="A++" />

<!-- IF S_CONTENT_DIRECTION eq 'rtl' -->
	<link href="{T_THEME_PATH}/bidi.css" rel="stylesheet" type="text/css" media="screen, projection" />
<!-- ENDIF -->

    <!--fade-header by Slash www.wiizard.it-->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
        <script language="JavaScript" type="text/javascript">
        $(document).ready(function(){
                   
                    var imgArr = new Array( // path immagini
                       '{T_THEME_PATH}/images/bgheader.jpg',
                            '{T_THEME_PATH}/images/bgheader1.jpg',
                            '{T_THEME_PATH}/images/bgheader2.jpg',
                            '{T_THEME_PATH}/images/bgheader3.jpg',
                            '{T_THEME_PATH}/images/bgheader4.jpg',
                            '{T_THEME_PATH}/images/bgheader5.jpg',
                            '{T_THEME_PATH}/images/bgheader6.jpg',
                            '{T_THEME_PATH}/images/bgheader7.jpg',
                            '{T_THEME_PATH}/images/bgheader8.jpg',
                            '{T_THEME_PATH}/images/header9.jpg',
                            '{T_THEME_PATH}/images/header10.jpg',
                            '{T_THEME_PATH}/images/bgheader11.jpg',
                            '{T_THEME_PATH}/images/header12.jpg',
                            '{T_THEME_PATH}/images/bgheader15.jpg'
                       );
                       
                    var preloadArr = new Array();
                    var i;
                   
                    /* preload immagini*/
                    for(i=0; i < imgArr.length; i++){
                       preloadArr[i] = new Image();
                       preloadArr[i].src = imgArr[i];
                    }
                   
                    var currImg = 1;
                    var intID = setInterval(changeImg, 5000); // l' immagine cambia ogni: in millisecondi /
                   
                    function changeImg(){
                       $('.headerbar').animate({opacity: 0}, 1, function(){
                          $(this).css('background','url(' + preloadArr[currImg++%preloadArr.length].src +')');
                       }).animate({opacity: 1}, 1000);
                    }
         
                 });
        </script>
        <!--fade-header by Slash www.wiizard.it-->

<!-- IF not S_IS_BOT -->
    <script type="text/javascript" src="https://webchat.chatme.im/php/get.php?l=it&t=js&g=mini.xml&f=jquery.js"></script>
    <script type="text/javascript">
        $.noConflict();
        jQuery(document).ready(function() {
        MINI_GROUPCHATS = ["Yoshiitaly@conference.chatme.im"];
        <!-- IF S_USER_LOGGED_IN -->
        MINI_NICKNAME = "{S_USERNAME}";
        current_sessid = "{SESSION_ID}";
        <!-- ENDIF -->
        <!-- IF not S_USER_LOGGED_IN -->
              current_sessid = "";
        <!-- ENDIF -->
        saved_sessid = getDB("jappix-mini", "phpbb_sessid");
          if (saved_sessid != current_sessid) removeDB('jappix-mini', 'dom');
          setDB("jappix-mini", "phpbb_sessid", current_sessid);
        MINI_ANIMATE = true;
        MINI_RESOURCE = "{SESSION_ID}";
        launchMini(false, false, "anonymous.chatme.im");
        });
    </script>
<!-- ENDIF -->

<!-- MOD : MSSTI ABBC3 (v{S_ABBC3_VERSION}) - Start //-->
<!-- INCLUDE ./../../abbcode/abbcode_header.html -->
<!-- MOD : MSSTI ABBC3 (v{S_ABBC3_VERSION}) - End //-->

<!-- IF SITE_BG_IMG -->
<style type="text/css">
<!--
.headerbar {background:url("{SITE_BG_IMG}") repeat;}
-->
</style>
<!-- ENDIF -->

</head>


    o sono scemo io o ce qualcosa che non va bene per favore aiutatemi grazie e tutti ...
« Discussione precedente | Prossima discussione »

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •  

Regole del forum