Stopniowe rozjaśnianie obrazka po najechaniu myszką

**Brianfiki** · (Ten post był ostatnio modyfikowany: 12.05.2012, 19:15 przez Brianfiki.)

Chciałbym zrobić obrazek który po najechaniu na niego myszką rozjaśnia się. To znaczy najpierw jest przyciemniony, a po najechaniu stopniowo się rozjaśnia.

Robiłem to dwoma sposobami
1:
Dodałem .css

.obrazek:hover {
filter: alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
} 

i gdzieś w szablonie np. do sideboxa obrazek

<img src="sciezka_obrazka.rozszerzenie" alt="opis_obrazka" class="obrazek" /> 

Problemy z pierwszym sposobem były dwa:
- Obrazek przed najechaniem był normalny, a po najechaniu przyciemniony,
- Obrazek po najechaniu zaciemniał się nagle, a nie stopniowo

Sposób 2:
Do .css wstawiłem poprzedni lub ten kod

.obrazek:hover {
height: XXXpx;
width: XXXpx;
opacity: 0.3;
filter: alpha(opacity=30);
} 

oraz obrazek do szablonu tak:

<img id="Image1" class="obrazek" src="LINK" style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; opacity: 0.5; " <="" a=""> 

Obrazek jest przyciemniony, ale się nie rozjaśnia.

Czytałem, że jak ma się rozjaśniać stopniowo to trzeba Java Script

Znalazłem taki kodzik, ale nie wiem co z nim zrobić - w JS jestem zielony :shy:

http://forum.ks-ekspert.pl/topic/53605-r..._p__408040

**Krzysiu** · (Ten post był ostatnio modyfikowany: 12.05.2012, 19:26 przez Krzysiu.)

Stopniowo w cssie, nie zrobisz.

. Musisz użyć js, jakaś funkcja podmieniająca opacity, w forze, opóźniona delayem. np. document.obrazek, style="opacity:0.x". A resztę konfiguracji style, to bym podpisał standardowo w <style>.

@Down: jQuery, jeszcze lepiej. Mniam!

O kurcze, jestem w tyle z cssem. Zawsze byłem z nim na bakier, dzięki wielkie, zapoznam się z tym. :>

**MazuLuka** · (Ten post był ostatnio modyfikowany: 12.05.2012, 19:25 przez MazuLuka.)

Tu masz opisane rok po kroku co gdzie masz wstawić:
http://grafifor.pl/Temat-zmiana-jasnosci...u-tutorial
~Autorem poradnika jest Focus.

PS.

Krzysiu napisał(a):Stopniowo w cssie, nie zrobisz.

Jak to nie, w CSS3 zrobisz za pomocą "Transitions".

**Krzysiu** · (Ten post był ostatnio modyfikowany: 12.05.2012, 19:33 przez Krzysiu.)

<html>

<style>

.test1 {

    background: #f00;

    color: #fff;

    -moz-transition-duration: 1s;

    -moz-transition-timing-function: ease-in;

    -webkit-transition-duration: 1s;

    -webkit-transition-timing-function: ease-in;

    transition-duration: 1s;

    transition-timing-function: ease-in;

    opacity: 0.5;

}

.test1:hover {

 opacity: 1;

}

div {

    width: 100px;

    height: 20px;

    padding: 3px;

    text-align: center;

    margin-bottom: 5px;

}

</style>

<div class="test1">hover me</div>

</html>

Na podstawię jakiegoś kodu z internetu, tylko z cssem. Pięknie, pięknie!

. I po co obciążać użytkownika jquery?

**Brianfiki** · 12.05.2012, 20:27

Zrobiłem według poradnika na grafifor i o ile ze wstawieniem kodu sobie poradziłem, to nie wiem gdzie wstawić

jQuery.noConflict();

Cytat: oraz w kodzie przed znacznikiem </script> wstawiamy jQuery.noConflict();

</script> to ja tam mam dużo :E

A to mój kod

<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />
<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />
<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1603"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1603"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>
{$stylesheets}
<script type="text/javascript">
<!--
    var cookieDomain = "{$mybb->settings['cookiedomain']}";
    var cookiePath = "{$mybb->settings['cookiepath']}";
    var cookiePrefix = "{$mybb->settings['cookieprefix']}";
    var deleteevent_confirm = "{$lang->deleteevent_confirm}";
    var removeattach_confirm = "{$lang->removeattach_confirm}";
    var loading_text = '{$lang->ajax_loading}';
    var saving_changes = '{$lang->saving_changes}';
    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";
    var my_post_key = "{$mybb->post_code}";
    var imagepath = "{$theme['imgdir']}";
// -->
</script>
{$newpmmsg}
<script type='text/javascript' 
        src='jscripts/jquery-1.3.2.min.js'>
    </script>
    
    <script type="text/javascript">
        jQuery(function() {
            jQuery('.imgOpa').each(function() {
                jQuery(this).hover(
                    function() {
                        jQuery(this).stop().animate({ opacity: 1.0 }, 400);
                    },
                   function() {
                       jQuery(this).stop().animate({ opacity: 0.5 }, 400);
                   })
                });
        });
    </script>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
<script type="text/javascript" src="images/BlueAndGreen/js/tabs.js"></script>


<script type="text/javascript">
jQuery(document).ready(function () {
 
    //Append a div with hover class to all the LI
    jQuery('#navMenu li').append('<div class="hover"></div>');
 
 
    jQuery('#navMenu li').hover(
         
        //Mouseover, fadeIn the hidden hover class  
        function() {
             
            jQuery(this).children('div').stop(true, true).fadeIn('1000');    
         
        }, 
     
        //Mouseout, fadeOut the hover class
        function() {
         
            jQuery(this).children('div').stop(true, true).fadeOut('1000');   
         
    }).click (function () {
     
        //Add selected class if user clicked on it
        jQuery(this).addClass('selected');
         
    });
 
});
</script>

<script type="text/javascript">
    jQuery(document).ready( function() {
      jQuery('#tab-container').easytabs();
    });
</script>



<script type="text/javascript"> 
jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");
    
    jQuery("ul.topnav li span").click(function() { 
        
        
        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {
        }, function(){    
            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 
        });

        
        }).hover(function() { 
            jQuery(this).addClass("subhover");
        }, function(){    //On Hover Out
            jQuery(this).removeClass("subhover"); 
    });

});
</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");
    
    jQuery("ul.topnav li span").click(function() { 
        
        
        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {
        }, function(){    
            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 
        });

        
        }).hover(function() { 
            jQuery(this).addClass("subhover");
        }, function(){    //On Hover Out
            jQuery(this).removeClass("subhover"); 
    });

});
</script>

<script type="text/javascript"> 
jQuery(document).ready(function(){  
  
    jQuery("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)  
  
    jQuery("ul.topnav li span").click(function() { //When trigger is clicked...  
  
        //Following events are applied to the subnav itself (moving subnav up and down)  
        jQuery(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click  
  
        jQuery(this).parent().hover(function() {  
        }, function(){  
            jQuery(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up  
        });  
  
        //Following events are applied to the trigger (Hover events for the trigger)  
        }).hover(function() {  
            jQuery(this).addClass("subhover"); //On hover over, add class "subhover"  
        }, function(){  //On Hover Out  
            jQuery(this).removeClass("subhover"); //On hover out, remove class "subhover"  
    });  
  
});  
</script>



    <script type="text/javascript">
         jQuery(function() {
              jQuery('.imgOpa').each(function() {
                  jQuery(this).hover(
                     function() {
                          jQuery(this).stop().animate({ opacity: 1.0 }, 400);
                     },
                    function() {
                         jQuery(this).stop().animate({ opacity: 0.5 }, 400);
                    })
                 });
         });
     </script>

<script type="text/javascript">jQuery.noConflict();</script>
{$highslide_script} 

**Krzysiu** · 12.05.2012, 20:32

jQuery.noConflict(); - likwiduje pozostałości, ja bym to raczej wstawiał na początku skryptów bo tak robią, ale jak kto woli.

. Czemu nie posłużysz się tym efektem w css?

**Brianfiki** · (Ten post był ostatnio modyfikowany: 12.05.2012, 20:45 przez Brianfiki.)

Łatwiej mi się operuje na jquery w szablonie.
Wstawiałem w różne miejsca jQuery.noConflict(); na początku całego headerinclude, na początku tylko kodu z przyciemnianiem, na końcu i nie działa - t.zn. nie działa zwijanie działów, ładowanie sb, bo zachodzi ten konflikt. Zapewne wstawiam w złe miejsce.

**Krzysiu** · 12.05.2012, 20:52

Co za dużo to niezdrowo!

<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />

<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />

<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />

<meta http-equiv="Content-Script-Type" content="text/javascript" />

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>

{$stylesheets}

<script type="text/javascript">

<!--

    var cookieDomain = "{$mybb->settings['cookiedomain']}";

    var cookiePath = "{$mybb->settings['cookiepath']}";

    var cookiePrefix = "{$mybb->settings['cookieprefix']}";

    var deleteevent_confirm = "{$lang->deleteevent_confirm}";

    var removeattach_confirm = "{$lang->removeattach_confirm}";

    var loading_text = '{$lang->ajax_loading}';

    var saving_changes = '{$lang->saving_changes}';

    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";

    var my_post_key = "{$mybb->post_code}";

    var imagepath = "{$theme['imgdir']}";

// -->

</script>

{$newpmmsg}

<script type='text/javascript' 

        src='jscripts/jquery-1.3.2.min.js'>

    </script>

    <script type="text/javascript">

        jQuery(function() {

            jQuery('.imgOpa').each(function() {

                jQuery(this).hover(

                    function() {

                        jQuery(this).stop().animate({ opacity: 1.0 }, 400);

                    },

                   function() {

                       jQuery(this).stop().animate({ opacity: 0.5 }, 400);

                   })

                });

        });

    </script>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>

<script type="text/javascript" src="images/BlueAndGreen/js/tabs.js"></script>

<script type="text/javascript">

jQuery.noConflict();

jQuery(document).ready(function () {

    //Append a div with hover class to all the LI

    jQuery('#navMenu li').append('<div class="hover"></div>');

    jQuery('#navMenu li').hover(

        //Mouseover, fadeIn the hidden hover class  

        function() {

            jQuery(this).children('div').stop(true, true).fadeIn('1000');    

        }, 

        //Mouseout, fadeOut the hover class

        function() {

            jQuery(this).children('div').stop(true, true).fadeOut('1000');   

    }).click (function () {

        //Add selected class if user clicked on it

        jQuery(this).addClass('selected');

    });

});

</script>

<script type="text/javascript">

    jQuery(document).ready( function() {

      jQuery('#tab-container').easytabs();

    });

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");

    jQuery("ul.topnav li span").click(function() { 

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {

        }, function(){    

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 

        });

        }).hover(function() { 

            jQuery(this).addClass("subhover");

        }, function(){    //On Hover Out

            jQuery(this).removeClass("subhover"); 

    });

});

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");

    jQuery("ul.topnav li span").click(function() { 

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {

        }, function(){    

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 

        });

        }).hover(function() { 

            jQuery(this).addClass("subhover");

        }, function(){    //On Hover Out

            jQuery(this).removeClass("subhover"); 

    });

});

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){  

    jQuery("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)  

    jQuery("ul.topnav li span").click(function() { //When trigger is clicked...  

        //Following events are applied to the subnav itself (moving subnav up and down)  

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click  

        jQuery(this).parent().hover(function() {  

        }, function(){  

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up  

        });  

        //Following events are applied to the trigger (Hover events for the trigger)  

        }).hover(function() {  

            jQuery(this).addClass("subhover"); //On hover over, add class "subhover"  

        }, function(){  //On Hover Out  

            jQuery(this).removeClass("subhover"); //On hover out, remove class "subhover"  

    });  

});  

</script>

{$highslide_script}

Try it!

**Brianfiki** · 12.05.2012, 20:54

Człowiek kiedyś zaszaleć musi

Nie działa

**Krzysiu** · 12.05.2012, 20:58

Lolz, a spróbuj to:

<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />

<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />

<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />

<meta http-equiv="Content-Script-Type" content="text/javascript" />

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>

{$stylesheets}

<script type="text/javascript">

<!--

    var cookieDomain = "{$mybb->settings['cookiedomain']}";

    var cookiePath = "{$mybb->settings['cookiepath']}";

    var cookiePrefix = "{$mybb->settings['cookieprefix']}";

    var deleteevent_confirm = "{$lang->deleteevent_confirm}";

    var removeattach_confirm = "{$lang->removeattach_confirm}";

    var loading_text = '{$lang->ajax_loading}';

    var saving_changes = '{$lang->saving_changes}';

    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";

    var my_post_key = "{$mybb->post_code}";

    var imagepath = "{$theme['imgdir']}";

// -->

</script>

{$newpmmsg}

<script type='text/javascript' 

        src='jscripts/jquery-1.3.2.min.js'>

    </script>

    <script type="text/javascript">

    jQuery.noConflict();

        jQuery(function() {

            jQuery('.imgOpa').each(function() {

                jQuery(this).hover(

                    function() {

                        jQuery(this).stop().animate({ opacity: 1.0 }, 400);

                    },

                   function() {

                       jQuery(this).stop().animate({ opacity: 0.5 }, 400);

                   })

                });

        });

jQuery.noConflict();

</script>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>

<script type="text/javascript" src="images/BlueAndGreen/js/tabs.js"></script>

<script type="text/javascript">

jQuery(document).ready(function () {

    //Append a div with hover class to all the LI

    jQuery('#navMenu li').append('<div class="hover"></div>');

    jQuery('#navMenu li').hover(

        //Mouseover, fadeIn the hidden hover class  

        function() {

            jQuery(this).children('div').stop(true, true).fadeIn('1000');    

        }, 

        //Mouseout, fadeOut the hover class

        function() {

            jQuery(this).children('div').stop(true, true).fadeOut('1000');   

    }).click (function () {

        //Add selected class if user clicked on it

        jQuery(this).addClass('selected');

    });

});

</script>

<script type="text/javascript">

    jQuery(document).ready( function() {

      jQuery('#tab-container').easytabs();

    });

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");

    jQuery("ul.topnav li span").click(function() { 

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {

        }, function(){    

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 

        });

        }).hover(function() { 

            jQuery(this).addClass("subhover");

        }, function(){    //On Hover Out

            jQuery(this).removeClass("subhover"); 

    });

});

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");

    jQuery("ul.topnav li span").click(function() { 

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {

        }, function(){    

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 

        });

        }).hover(function() { 

            jQuery(this).addClass("subhover");

        }, function(){    //On Hover Out

            jQuery(this).removeClass("subhover"); 

    });

});

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){  

    jQuery("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)  

    jQuery("ul.topnav li span").click(function() { //When trigger is clicked...  

        //Following events are applied to the subnav itself (moving subnav up and down)  

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click  

        jQuery(this).parent().hover(function() {  

        }, function(){  

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up  

        });  

        //Following events are applied to the trigger (Hover events for the trigger)  

        }).hover(function() {  

            jQuery(this).addClass("subhover"); //On hover over, add class "subhover"  

        }, function(){  //On Hover Out  

            jQuery(this).removeClass("subhover"); //On hover out, remove class "subhover"  

    });  

});  

</script>

{$highslide_script}

Oczywiście zakładam że dodałeś tylko to jquery na rozjaśnianie, a wcześniej wszystko działało.

**Brianfiki** · 12.05.2012, 21:00

Nie działa

Przed dodaniem rozjaśniania działało, wszystko się zwijało, ładowało.

**Krzysiu** · 12.05.2012, 21:05

<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />

<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />

<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />

<meta http-equiv="Content-Script-Type" content="text/javascript" />

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>

{$stylesheets}

<script type="text/javascript">

<!--

    var cookieDomain = "{$mybb->settings['cookiedomain']}";

    var cookiePath = "{$mybb->settings['cookiepath']}";

    var cookiePrefix = "{$mybb->settings['cookieprefix']}";

    var deleteevent_confirm = "{$lang->deleteevent_confirm}";

    var removeattach_confirm = "{$lang->removeattach_confirm}";

    var loading_text = '{$lang->ajax_loading}';

    var saving_changes = '{$lang->saving_changes}';

    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";

    var my_post_key = "{$mybb->post_code}";

    var imagepath = "{$theme['imgdir']}";

// -->

</script>

{$newpmmsg}

<script type='text/javascript' 

        src='jscripts/jquery-1.3.2.min.js'>

    </script>

    <script type="text/javascript">

    var jQuery = jQuery.noConflict();

        jQuery(function() {

            jQuery('.imgOpa').each(function() {

                jQuery(this).hover(

                    function() {

                        jQuery(this).stop().animate({ opacity: 1.0 }, 400);

                    },

                   function() {

                       jQuery(this).stop().animate({ opacity: 0.5 }, 400);

                   })

                });

        });

</script>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>

<script type="text/javascript" src="images/BlueAndGreen/js/tabs.js"></script>

<script type="text/javascript">

jQuery(document).ready(function () {

    //Append a div with hover class to all the LI

    jQuery('#navMenu li').append('<div class="hover"></div>');

    jQuery('#navMenu li').hover(

        //Mouseover, fadeIn the hidden hover class  

        function() {

            jQuery(this).children('div').stop(true, true).fadeIn('1000');    

        }, 

        //Mouseout, fadeOut the hover class

        function() {

            jQuery(this).children('div').stop(true, true).fadeOut('1000');   

    }).click (function () {

        //Add selected class if user clicked on it

        jQuery(this).addClass('selected');

    });

});

</script>

<script type="text/javascript">

    jQuery(document).ready( function() {

      jQuery('#tab-container').easytabs();

    });

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");

    jQuery("ul.topnav li span").click(function() { 

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {

        }, function(){    

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 

        });

        }).hover(function() { 

            jQuery(this).addClass("subhover");

        }, function(){    //On Hover Out

            jQuery(this).removeClass("subhover"); 

    });

});

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");

    jQuery("ul.topnav li span").click(function() { 

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {

        }, function(){    

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 

        });

        }).hover(function() { 

            jQuery(this).addClass("subhover");

        }, function(){    //On Hover Out

            jQuery(this).removeClass("subhover"); 

    });

});

</script>

<script type="text/javascript"> 

jQuery(document).ready(function(){  

    jQuery("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)  

    jQuery("ul.topnav li span").click(function() { //When trigger is clicked...  

        //Following events are applied to the subnav itself (moving subnav up and down)  

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click  

        jQuery(this).parent().hover(function() {  

        }, function(){  

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up  

        });  

        //Following events are applied to the trigger (Hover events for the trigger)  

        }).hover(function() {  

            jQuery(this).addClass("subhover"); //On hover over, add class "subhover"  

        }, function(){  //On Hover Out  

            jQuery(this).removeClass("subhover"); //On hover out, remove class "subhover"  

    });  

});  

</script>

{$highslide_script}

Kombinujemy dalej!

**Brianfiki** · 12.05.2012, 21:14

Nie działa

**Krzysiu** · 12.05.2012, 21:28

Kończą mi się koncepcje.

<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />

<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />

<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />

<meta http-equiv="Content-Script-Type" content="text/javascript" />

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1603"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>

{$stylesheets}

<script type="text/javascript">

<!--

    var cookieDomain = "{$mybb->settings['cookiedomain']}";

    var cookiePath = "{$mybb->settings['cookiepath']}";

    var cookiePrefix = "{$mybb->settings['cookieprefix']}";

    var deleteevent_confirm = "{$lang->deleteevent_confirm}";

    var removeattach_confirm = "{$lang->removeattach_confirm}";

    var loading_text = '{$lang->ajax_loading}';

    var saving_changes = '{$lang->saving_changes}';

    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";

    var my_post_key = "{$mybb->post_code}";

    var imagepath = "{$theme['imgdir']}";

// -->

</script>

{$newpmmsg}

<script type='text/javascript' 

        src='jscripts/jquery-1.3.2.min.js'>

    </script>

    <script type="text/javascript">

    jQuery.noConflict();

        jQuery(function() {

            jQuery('.imgOpa').each(function() {

                jQuery(this).hover(

                    function() {

                        jQuery(this).stop().animate({ opacity: 1.0 }, 400);

                    },

                   function() {

                       jQuery(this).stop().animate({ opacity: 0.5 }, 400);

                   })

                });

        });

</script>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>

<script type="text/javascript" src="images/BlueAndGreen/js/tabs.js"></script>

<script type="text/javascript">

jQuery.noConflict();

jQuery(document).ready(function () {

    //Append a div with hover class to all the LI

    jQuery('#navMenu li').append('<div class="hover"></div>');

    jQuery('#navMenu li').hover(

        //Mouseover, fadeIn the hidden hover class  

        function() {

            jQuery(this).children('div').stop(true, true).fadeIn('1000');    

        }, 

        //Mouseout, fadeOut the hover class

        function() {

            jQuery(this).children('div').stop(true, true).fadeOut('1000');   

    }).click (function () {

        //Add selected class if user clicked on it

        jQuery(this).addClass('selected');

    });

});

</script>

<script type="text/javascript">

jQuery.noConflict();

    jQuery(document).ready( function() {

      jQuery('#tab-container').easytabs();

    });

</script>

<script type="text/javascript"> 

jQuery.noConflict();

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");

    jQuery("ul.topnav li span").click(function() { 

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {

        }, function(){    

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 

        });

        }).hover(function() { 

            jQuery(this).addClass("subhover");

        }, function(){    //On Hover Out

            jQuery(this).removeClass("subhover"); 

    });

});

</script>

<script type="text/javascript"> 

jQuery.noConflict();

jQuery(document).ready(function(){

    jQuery("ul.subnav").parent().append("");

    jQuery("ul.topnav li span").click(function() { 

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show();

        jQuery(this).parent().hover(function() {

        }, function(){    

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); 

        });

        }).hover(function() { 

            jQuery(this).addClass("subhover");

        }, function(){    //On Hover Out

            jQuery(this).removeClass("subhover"); 

    });

});

</script>

<script type="text/javascript"> 

jQuery.noConflict();

jQuery(document).ready(function(){  

    jQuery("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)  

    jQuery("ul.topnav li span").click(function() { //When trigger is clicked...  

        //Following events are applied to the subnav itself (moving subnav up and down)  

        jQuery(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click  

        jQuery(this).parent().hover(function() {  

        }, function(){  

            jQuery(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up  

        });  

        //Following events are applied to the trigger (Hover events for the trigger)  

        }).hover(function() {  

            jQuery(this).addClass("subhover"); //On hover over, add class "subhover"  

        }, function(){  //On Hover Out  

            jQuery(this).removeClass("subhover"); //On hover out, remove class "subhover"  

    });  

});  

</script>

{$highslide_script}

Spróbuj jak nie pójdzie wywal wszystkie noconflicy.

**Brianfiki** · 12.05.2012, 21:33

Yeah

Działa wszystko, jesteś wielki

Dzięki za poświęcenie czasu. Pomógł + rep.

Dołącz do zespołu ekspertów! Backend lub Frontend Developer?

Stopniowe rozjaśnianie obrazka po najechaniu myszką

Brianfiki

Krzysiu

MazuLuka

Krzysiu

Brianfiki

Krzysiu

Brianfiki

Krzysiu

Brianfiki

Krzysiu

Brianfiki

Krzysiu

Brianfiki

Krzysiu

Brianfiki

Użytkownicy przeglądający ten wątek:

Zaloguj się
Login:
Hasło:	Nie pamiętam hasła
	Zapamiętaj mnie