Stopniowe rozjaśnianie obrazka po najechaniu myszką

Założony przez  Brianfiki.

12.05.2012, 19:10 (Ten post był ostatnio modyfikowany: 12.05.2012, 19:15 przez Brianfiki.)
#1
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
12.05.2012, 19:19 (Ten post był ostatnio modyfikowany: 12.05.2012, 19:26 przez Krzysiu.)
#2
Stopniowo w cssie, nie zrobisz. :P. 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. :>
12.05.2012, 19:21 (Ten post był ostatnio modyfikowany: 12.05.2012, 19:25 przez MazuLuka.)
#3
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".
12.05.2012, 19:33 (Ten post był ostatnio modyfikowany: 12.05.2012, 19:33 przez Krzysiu.)
#4
<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! :D. I po co obciążać użytkownika jquery? :D
12.05.2012, 20:27
#5
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} 
12.05.2012, 20:32
#6
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?
12.05.2012, 20:45 (Ten post był ostatnio modyfikowany: 12.05.2012, 20:45 przez Brianfiki.)
#7
Ł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.
12.05.2012, 20:52
#8
Co za dużo to niezdrowo! :D

<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!
12.05.2012, 20:54
#9
Człowiek kiedyś zaszaleć musi :D
Nie działa :(
12.05.2012, 20:58
#10
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. :D
12.05.2012, 21:00
#11
Nie działa :P
Przed dodaniem rozjaśniania działało, wszystko się zwijało, ładowało.
12.05.2012, 21:05
#12
<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!
12.05.2012, 21:14
#13
Nie działa
12.05.2012, 21:28
#14
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.
12.05.2012, 21:33
#15
Yeah :zdziwko:

Działa wszystko, jesteś wielki :) Dzięki za poświęcenie czasu. Pomógł + rep.



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

1 gości