Learn how to use jQuery at the Blog

Webgrafismo « visit

  • Added 8 months ago
  • 347 Lines of Code shown
  • 2 Links of Interest
http://webgrafismo.com
Source Code Links of Interest
This is my Source Code and I don't want to show it here
View Source Code only (as overlay) 
// That code snippet belongs to Webgrafismo - http://webgrafismo.com

// 		console.log("test");
jQuery.noConflict();

function slidePanel(){
	var footer = jQuery(".footer").html();
	jQuery(".footer ul").remove();
	jQuery("#top").prepend("<span class='footer_scroll give_text_tooltip' title='Websites Recomendados'></span><div class='footer advanced_footer'><div class='footer_bg'>"+ footer +"</div></div>");	
	jQuery(".advanced_footer .footer_meta").remove();
	jQuery(".advanced_footer").css({opacity:0.97});
	
	jQuery(".footer_scroll").click(function(){
	  jQuery(".advanced_footer").slideToggle("slow");
	  jQuery(this).toggleClass("active");
	});

	}

function searchpanel(){
	var searchpanel = jQuery(".noscript").html();
	jQuery(".noscript").remove();
	jQuery("#top").prepend("<span class='searchpanel_scroll give_text_tooltip' title='Motor de Busca'></span><div class='searchpanel'><div class='adjustor'>"+ searchpanel +"</div></div>");	
	
	jQuery(".searchpanel_scroll").click(function(){
	  jQuery(".searchpanel").slideToggle("slow");
	  jQuery(this).toggleClass("active");
	});

	}


function simple_tooltip(target_items, name){
 jQuery(target_items).each(function(i){
									
		jQuery("body").append("<div class='"+name+"' id='"+name+i+"'><img src='"+jQuery(this).attr('rel')+"' alt='' /></div>");
		
		var toolheight = jQuery("#"+name+i+" img").height();
		var toolwidth = jQuery("#"+name+i+" img").width();
		var my_tooltip = jQuery("#"+name+i);
		
		
		my_tooltip.css({height:toolheight+"px" , width:toolwidth+"px"}).after("<div class='wrap_"+name+"' id='wrap_"+name+i+"'></div>");
		
		
		var my_tooltip = jQuery("#"+name+i);
		var my_tooltip_wrap = jQuery("#wrap_"+name+i);
		if(jQuery(this).attr("rel") != "" && jQuery(this).attr("rel") != "undefined" ){
		
		jQuery(this).removeAttr("title").mouseover(function(){

				my_tooltip.css({display:"block", height:toolheight+"px", width:toolwidth+"px"});
				
		}).mousemove(function(kmouse){
				toolheight = jQuery("#"+name+i+" img").height();
		        toolwidth = jQuery("#"+name+i+" img").width();
				my_tooltip_wrap.css({display:"block", opacity:0.7, height:(toolheight+20)+"px", width:(toolwidth+20)+"px"});
				var border_top = jQuery(window).scrollTop(); 
				var border_right = jQuery(window).width();
				var left_pos;
				var top_pos;
				var offset = 30;
				if(border_right - (offset *2) >= my_tooltip.width() + kmouse.pageX){
					left_pos = kmouse.pageX+offset;
					} else{
					left_pos = kmouse.pageX-my_tooltip.width()-offset;
					}
					
				if(border_top + offset>= kmouse.pageY - my_tooltip.height()){
					top_pos = kmouse.pageY+offset;
					} else{
					top_pos = kmouse.pageY-my_tooltip.height()-offset;
					}	
				
				
				my_tooltip.css({left:left_pos, top:top_pos});
				my_tooltip_wrap.css({left:left_pos, top:top_pos});
		}).mouseout(function(){
				my_tooltip.css({left:"-9999px"});
				my_tooltip_wrap.css({left:"-9999px"});

		});
		
		}
	});
}





function kriesi_tab(wrapper, header, content){
    jQuery(".widget_block").removeClass("tablist");
	jQuery(".nowidget").addClass("tablist");
    
	var title = wrapper + " " + header;
	var container_to_hide = wrapper + " " + content;
	disable = false;
	

jQuery(title).css({display: "none"}).each(
					  function(i){
						 if (i == 0){
						jQuery(wrapper).prepend("<a href='/' class='widgettitle advanced_link active'>"+jQuery(this).html()+"</a>");
							}else{
						jQuery(".advanced_link:last").after("<a href='/'class='widgettitle advanced_link'>"+jQuery(this).html()+"</a>");
							}
						 }
					  );

jQuery(container_to_hide).each(
						 function(i){
						jQuery(this).addClass("tablist list_"+i); 
							if(i != 0){
								jQuery(this).css({display: "none"});
							}
						  }
					 );

jQuery(".advanced_link").each(
					  function(i){
						jQuery( this ).bind ("click",function(){
												if(jQuery(this).hasClass('active')){return false}
														 if(disable == false){disable = true;
														 jQuery(".advanced_link").removeClass("active");
														 jQuery(this).addClass("active");
														 jQuery(container_to_hide+":visible").slideUp(1000,function(){
																	jQuery(".list_"+i).slideDown(1000, function(){disable=false; });
																								   });
														 }
														 return false;

														 });
						  }
					  );
}




function my_smothscroll(){
jQuery('a[href*=#]').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
    && location.hostname == this.hostname) {
      var $target = jQuery(this.hash);
      $target = $target.length && $target
      || jQuery('[name=' + this.hash.slice(1) +']');
      if ($target.length) {
        var targetOffset = $target.offset().top;
        jQuery('html,body')
        .animate({scrollTop: targetOffset}, 700);
       return false;
      }
    }
  });
}


function kriesi_mainmenu(){
	if(!jQuery.browser.msie){// IE  - 2nd level Fix
	jQuery(" #nav ul ").css({opacity:"0.95"});
	}
jQuery("#nav a").removeAttr('title');
jQuery(" #nav ul ").css({display: "none"}); // Opera Fix
jQuery(" #nav > li > ul").parent().find("a:first").append("<span class='sub_list'>&nbsp;</span>");
jQuery(" #nav ul li > ul").parent().find("a:first").append("<span class='sub_sub_list'>&nbsp;</span>");

jQuery(" #nav li").hover(function(){
		jQuery(this).find('ul:first:hidden').css({visibility: "visible",display: "none"}).show(400);
		},function(){
		jQuery(this).find('ul:first').css({visibility: "hidden"});
		});
}


function kriesi_noscript(){

    
    $content =jQuery(".widget_rss h3 a:eq(1)").html();
    jQuery(".widget_rss h3 a").remove();
    jQuery(".widget_rss h3").append($content);
	
	}
	
		

	
	function kriesi_scroller(wrapping_element, scrolling_element, appendbuttons){
		
	if (jQuery(wrapping_element).length > 0){
	offset = jQuery(wrapping_element).offset();
	scrolling_area = jQuery(scrolling_element).height() - jQuery(wrapping_element).height();
	
	var SCROLL_FIX = jQuery(wrapping_element).height();
	var scroll_amount = 0;
	var currentPos = jQuery(scrolling_element).position();
	var animating = false;
	var ticker=0;
	var height_of_rest=0;
	var prevurl;
	
	jQuery(".teaserbox").prepend("<span><a href='' title=''>Visite este Site</a></span>");
	prevurl = jQuery(scrolling_element +" li:eq(0) a").attr("href");
	jQuery(".teaserbox span a").attr({href: prevurl});
	
	jQuery(".teaserbox span").click(function(){
	  window.location=prevurl; return false;
	});

	
	
	
	jQuery(scrolling_element +" li:eq("+ticker+") a").addClass("ticker");
		
	jQuery(scrolling_element +" li a").each(function(i){
													 jQuery(this).bind("click", function(){
															  clearInterval(newsticker_interval);
															  if(!(jQuery(".teaser_img_item_"+i).hasClass("displayme"))){
															  jQuery(".displayme").fadeOut(400, function(){
																										 jQuery(this).removeClass("displayme");
																										 
																										 });
															  jQuery(".teaser_img_item_"+i).fadeIn(400).addClass("displayme");
															  jQuery(".teaser_excerpt_"+i).slideDown(1000).addClass("displayme");
															  prevurl = jQuery(scrolling_element +" li:eq("+i+") a").attr("href");
															  jQuery(".teaserbox span a").attr({href: prevurl});
															  jQuery(".ticker").removeClass("ticker");
															  jQuery(this).addClass("ticker");
															  }
															  return false;
															  });
													 
													 
													 });
	
	function newsticker(){
		height_of_rest=0;
		jQuery(scrolling_element +" li:gt("+ticker+")").each(function(){
																	 height_of_rest += jQuery(this).height();
																	  });
		
		var amount_to_scroll;
		currentPos = jQuery(scrolling_element).position();
		
		if(height_of_rest >= jQuery(wrapping_element).height()){
		amount_to_scroll = jQuery(scrolling_element +" li:eq("+ticker+")").height() - currentPos.top;
		}else{
		amount_to_scroll = jQuery(scrolling_element).height() - jQuery(wrapping_element).height();
		}

		if(ticker + 2 > jQuery(scrolling_element +" li").length){
		amount_to_scroll = 0;
		ticker = -1;
			}
		if (scrolling_area > 0){
		jQuery(scrolling_element).animate({top: -amount_to_scroll},250);
		}
		
		
		
		ticker++;
		jQuery(".ticker").removeClass("ticker");
		prevurl = jQuery(scrolling_element +" li:eq("+ticker+") a").attr("href");
		jQuery(".teaserbox span a").attr({href: prevurl});
		
		jQuery(scrolling_element +" li:eq("+ticker+") a").addClass("ticker");
		jQuery(".displayme").fadeOut(400, function(){jQuery(this).removeClass("displayme");});
		
		jQuery(".teaser_img_item_"+ticker).fadeIn(400).addClass("displayme");
		jQuery(".teaser_excerpt_"+ticker).slideDown(1000).addClass("displayme");
	
		}
		
	newsticker_interval = setInterval(newsticker,10000);
if (scrolling_area > 0){
	jQuery(appendbuttons).append("<span class='scrollup disabled'>UP</span> <span class='scrolldown'>DOWN</span>");
	jQuery(".scrolldown").bind("click",function(){scroll_items("down",SCROLL_FIX)});
	jQuery(".scrollup").bind("click",function(){scroll_items("up",SCROLL_FIX)});
	
	function scroll_items(direction,amount){
		clearInterval(newsticker_interval);
		
		if (animating == false){
		animating = true;	
		currentPos = jQuery(scrolling_element).position();
		
		if (direction == "down") {
			if ((currentPos.top*-1) + amount < jQuery(scrolling_element).height() - jQuery(wrapping_element).height()){
				scroll_amount += amount;
			}else{
				scroll_amount = jQuery(scrolling_element).height() - jQuery(wrapping_element).height();
				jQuery(".scrolldown").addClass("disabled");
			}jQuery(".scrollup").removeClass("disabled");
		}else
		if (direction == "up"){
			if(scroll_amount -  amount >= 0){
			scroll_amount -= amount;
			}else{
			scroll_amount = 0;
			jQuery(".scrollup").addClass("disabled");
			}jQuery(".scrolldown").removeClass("disabled");
		}
		jQuery(scrolling_element).animate({top: -scroll_amount},290, function(){animating = false;});
		
		
		}
	}
	}
}
}

function kriesi_tooltip2(selector, selectname, atrribute){
jQuery(selector).each(function(i){
			if (jQuery(this).attr(atrribute) != ""){
			jQuery("body").append("<div class='"+selectname+"' id='"+selectname+i+"'>"+jQuery(this).attr(atrribute)+"</div>");
			
			jQuery(this).removeAttr(atrribute).mouseover(function(e){
					jQuery("#"+selectname+i).css({opacity:0.85, display:"none", visibility:"visible"}).animate({"padding": "9px"}, 100).fadeIn(800);
			}).mousemove(function(e){
					jQuery("#"+selectname+i).css({left:e.pageX+14, top:e.pageY+14});
			}).mouseout(function(){
					jQuery("#"+selectname+i).css({display:"none", visibility:"hidden"});				  
			});
			
			
			}
		});
 	}


var enable_scrolling = jQuery("meta[name=Javazineoption1]").attr('content');
var enable_tooltips = jQuery("meta[name=Javazineoption2]").attr('content');
var enable_tabs = jQuery("meta[name=Javazineoption3]").attr('content');
var enable_footer = jQuery("meta[name=Javazineoption4]").attr('content');
	  
jQuery(document).ready(function(){
	

	if (enable_footer == 1){slidePanel();}
	searchpanel();
	kriesi_mainmenu();
	if (enable_tooltips == 1){
	simple_tooltip(".small_previewpic a, .give_tooltip","tooltip");
	kriesi_tooltip2('.give_text_tooltip, .give_text_tooltip a', 'tooltip2', 'title');	
	}
	kriesi_noscript();
	if (enable_scrolling == 1){kriesi_scroller(".infowrap", ".infowrap ul", ".teaser_infobox");}
	if (enable_tabs == 1){kriesi_tab('.widget_block','.widgettitle','.widget');}
});
  1. http://www.learningjquery.com/2007/10/improved-animated-scrolling-script-for-same-page-links
  2. http://www.shadowbox-js.com/