1//JERRO CUSTOM FUNCTIONS 2 3 4/* 5------------------------------------------------ 6PAGE LOADER 7------------------------------------------------ 8*/ 9$(window).load(function() { 10 $('#preloader').fadeOut(2000); 11 $('body').delay(1000).css({'overflow':'visible'}); 12 $('.scroll-arrow').addClass('animated fadeInUp'); 13}) 14 15/* 16------------------------------------------------ 17HEADER SCROLL DOWN ARROW ICON 18------------------------------------------------ 19*/ 20 21$(window).scroll(function(){ 22 var fromtop = $(document).scrollTop(); // pixels from top of screen 23 $('.scroll-arrow').addClass('animated fadeOutUp'); // use a better formula for better fading 24}); 25 26 27$(document).ready(function(){ 28 29 30/* 31------------------------------------------------ 32SERVICES BOX PICTOGRAM ANIMATION 33------------------------------------------------ 34*/ 35 36$( '.services-desc' ).hide(); 37 38/***$( '.services-box').hover( 39 function() { 40 $(this).find( '.icon-container .pictogram' ).transition({ rotate: '360deg' }); 41 $(this).find( '.icon-container h3' ).addClass('animated bounce'); 42 $(this).find( '.services-desc' ).show('slow'); 43 }, function() { 44 $(this).find( '.icon-container .pictogram' ).transition({ rotate: '0deg' }); 45 $(this).find( '.icon-container h3' ).removeClass('animated bounce') 46 $(this).find( '.services-desc' ).hide('slow'); 47 } 48); 49***/ 50 51/*** NEU $( '.services-box').click( 52 function() { 53 $(this).find( '.icon-container .pictogram' ).transition({ rotate: '360deg' }); 54 $(this).find( '.icon-container h3' ).addClass('animated bounce'); 55 $(this).find( '.services-desc' ).show('slow'); 56 } 57); 58 59 $( '.services-box').mouseleave( 60 function() { 61 $(this).find( '.services-desc' ).hide('slow'); 62 } 63); 64***/ 65 66 67 $('.services-box').click(function( event ) { 68 69 70 if(event.target == ("a")) return; 71 // $('.services-box').on('click'), function(event) { 72 // event.preventDefault(); 73 if ($(this).hasClass('active')) { 74 $(this).removeClass('active'); 75 $(this).find( '.services-desc' ).hide('slow'); 76 } else { 77 $('.services-desc').not(this).hide('slow'); 78 $(this).find( '.icon-container h4' ).addClass('animated bounce'); 79 $(this).find( '.services-desc' ).show('slow'); 80 $(this).addClass('active'); 81 82 83 } 84}); 85 86 87 88 89/* 90------------------------------------------------ 91HEADER JERRO CARUSEL 92http://www.owlgraphic.com/owlcarousel/ 93------------------------------------------------ 94*/ 95 96$('#header-carusel').owlCarousel({ 97 98 navigation: false, 99 navigationText: ['<span class="sprite carusel-left"></span>','<span class="sprite carusel-right"></span>'], 100 singleItem: true, 101 slideSpeed : 1000, 102 paginationSpeed : 1000, 103 autoPlay: true, 104 responsive: true, 105 goToFirst : true, 106 goToFirstSpeed : 1000, 107 baseClass : 'owl-carousel', 108 theme : 'jerro-carusel-theme', 109 transitionStyle: 'goDown' //fade, fadeUp, goDown 110 111}); 112 113 114/* 115------------------------------------------------ 116FAVORITE CARUSEL 117http://www.owlgraphic.com/owlcarousel/ 118------------------------------------------------ 119*/ 120 121 122$('#favorite-carusel').owlCarousel({ 123 124 // Most important owl features 125 items : 4, 126 itemsDesktop : [1199,3], 127 itemsDesktopSmall : [970,2], 128 itemsTablet: [750,1], 129 itemsMobile : false, 130 singleItem : false, 131 132 //Basic Speeds 133 slideSpeed : 1000, 134 paginationSpeed : 1000, 135 136 //Autoplay 137 autoPlay : false, 138 stopOnHover : false, 139 goToFirst : true, 140 goToFirstSpeed : 1000, 141 142 // Navigation 143 navigation:true, 144 navigationText : ['<span class="sprite carusel-left"></span>','<span class="sprite carusel-right"></span>'], 145 goToFirstNav : true, 146 scrollPerPage : false, 147 148 //Pagination 149 pagination : true, 150 paginationNumbers: false, 151 152 // Responsive 153 responsive: true, 154 responsiveRefreshRate : 200, 155 156 // CSS Styles 157 baseClass : 'owl-carousel', 158 theme : 'jerro-carusel-theme', 159 160}); 161 162 163 164/* 165------------------------------------------------ 166TWITTER FEEDS 167http://www.owlgraphic.com/owlcarousel/ 168https://github.com/sonnyt/Tweetie 169------------------------------------------------ 170*/ 171 172$('#entries-carusel').twittie({ 173 dateFormat: '%b / %d / %Y', 174 template: '<div class="item entry tweet"><h2 class="avatar">{{avatar}}</h2><blockquote>{{tweet}}</<blockquote><div class="date">{{date}}</div></div>', 175 count: 3 176}); 177 178 179 180/* 181------------------------------------------------ 182TEXT ROTATING 183https://github.com/peachananr/simple-text-rotator 184------------------------------------------------ 185*/ 186$('.rotate-flipCube').textrotator({ 187 animation: 'flipCube', // You can pick the way it animates when rotating through words. Options are dissolve (default), fade, flip, flipUp, flipCube, flipCubeUp and spin. 188 separator: ':', // If you don't want commas to be the separator, you can define a new separator (|, &, * etc.) by yourself using this field. 189 speed: 2000 // How many milliseconds until the next word show. 190}); 191 192$('.rotate-flip').textrotator({ 193 animation: 'flip', 194 separator: ':', 195 speed: 2000 196}); 197 198$('.rotate-flipUp').textrotator({ 199 animation: 'flipUp', 200 separator: ':', 201 speed: 2000 202}); 203 204$('.rotate-flipCubeUp').textrotator({ 205 animation: 'flipCubeUp', 206 separator: ':', 207 speed: 2000 208}); 209 210$('.rotate-spin').textrotator({ 211 animation: 'spin', 212 separator: ':', 213 speed: 2000 214}); 215 216$('.rotate-fade').textrotator({ 217 animation: 'fade', 218 separator: ':', 219 speed: 2000 220}); 221 222 223/* 224------------------------------------------------ 225SKILLS CHARTS 226http://anthonyterrien.com/knob/ 227------------------------------------------------ 228*/ 229 230 231$('.skill').each(function () { 232 233 var $this = $(this); 234 var myVal = $this.attr("rel"); 235 // alert(myVal); 236 $this.knob({ 237 'draw' : function () { 238 $(this.i).val(this.cv + '%') 239 }, 240 'fontWeight': '300', 241 'readOnly' : true, 242 'font' : 'Dosis', 243 'linecap' : 'round', 244 'inputColor' : '#4d4d4d', 245 'fgColor' : '#AECA2E', 246 'width' : '150',
247 'height' : '150', 248 'cursor' : false, 249 'thickness' : .1 250 }); 251 252 253 254 $({ 255 value: 0 256 }).animate({ 257 258 value: myVal 259 }, { 260 duration: 2000, 261 easing: 'swing', 262 step: function () { 263 $this.val(Math.ceil(this.value)).trigger('change'); 264 265 } 266 }) 267 268}); 269 270 271/* 272------------------------------------------------ 273NIVO LIGHTBOX - FAVORITES AND PORTFOLIO 274http://dev7studios.com/nivo-lightbox 275------------------------------------------------ 276*/ 277 278$('#favorite-carusel a, #portfolio-grid-1 a').nivoLightbox({ 279 effect: 'fall', // The effect to use when showing the lightbox (fade, fadeScale, slideLeft, slideRight, slideUp, slideDown, fall 280 theme: 'jerro', // The lightbox theme to use 281 keyboardNav: true, // Enable/Disable keyboard navigation (left/right/escape) 282 onInit: function(){}, // Callback when lightbox has loaded 283 beforeShowLightbox: function(){}, // Callback before the lightbox is shown 284 afterShowLightbox: function(lightbox){}, // Callback after the lightbox is shown 285 beforeHideLightbox: function(){}, // Callback before the lightbox is hidden 286 afterHideLightbox: function(){}, // Callback after the lightbox is hidden 287 onPrev: function(element){}, // Callback when the lightbox gallery goes to previous item 288 onNext: function(element){}, // Callback when the lightbox gallery goes to next item 289 errorMessage: 'The requested content cannot be loaded. Please try again later.' // Error message when content can't be loaded 290}); 291 292 293/* 294------------------------------------------------ 295QUICK POST HOVER ANIMATION 296------------------------------------------------ 297*/ 298 299 300$( '.quick-post .img').hover( 301 function() { 302 $(this).find( 'img' ).addClass('animated rotateOutDownLeft'); 303 }, function() { 304 $(this).find( 'img' ).removeClass('animated rotateOutDownLeft'); 305 } 306); 307 308 309 310/* 311------------------------------------------------ 312SINGLE POST - WINDOW 313------------------------------------------------ 314*/ 315 316// sets min-height of single-post window 317$('.single-post').css("min-height", ($( window ).height()-60)); 318 319 320/* 321------------------------------------------------ 322PORTFOLIO MIXITUP 323http://mixitup.io/ 324------------------------------------------------ 325*/ 326 327$('#portfolio-grid-1').mixitup({ 328 targetSelector: '.mix-1', 329 filterSelector: '.filter-1', 330 sortSelector: '.sort-1', 331 buttonEvent: 'click', 332 effects: ['fade'], 333 listEffects: null, 334 easing: 'smooth', 335 layoutMode: 'grid', 336 targetDisplayGrid: 'inline-block', 337 targetDisplayList: 'block', 338 gridClass: '', 339 listClass: '', 340 transitionSpeed: 600, 341 showOnLoad: 'all', 342 sortOnLoad: false, 343 multiFilter: false, 344 filterLogic: 'or', 345 resizeContainer: true, 346 minHeight: 0, 347 failClass: 'fail', 348 perspectiveDistance: '3000', 349 perspectiveOrigin: '50% 50%', 350 animateGridList: true, 351 onMixLoad: null, 352 onMixStart: null, 353 onMixEnd: null 354}); 355 356 357$('#portfolio-grid-2').mixitup({ 358 targetSelector: '.mix-2', 359 filterSelector: '.filter-2', 360 sortSelector: '.sort-2', 361 buttonEvent: 'click', 362 effects: ['fade'], 363 listEffects: null, 364 easing: 'smooth', 365 layoutMode: 'grid', 366 targetDisplayGrid: 'inline-block', 367 targetDisplayList: 'block', 368 gridClass: '', 369 listClass: '', 370 transitionSpeed: 600, 371 showOnLoad: 'all', 372 sortOnLoad: false, 373 multiFilter: false, 374 filterLogic: 'or', 375 resizeContainer: true, 376 minHeight: 0, 377 failClass: 'fail', 378 perspectiveDistance: '3000', 379 perspectiveOrigin: '50% 50%', 380 animateGridList: true, 381 onMixLoad: null, 382 onMixStart: null, 383 onMixEnd: null 384}); 385 386$('#portfolio-grid-2').jerroZoom(); 387 388 389/* 390------------------------------------------------ 391TOOLTIPS - BOOTSTRAP 392------------------------------------------------ 393*/ 394 395$('.title a').tooltip(); 396 397 398 399/* 400------------------------------------------------ 401STICKY MENU (FIXED) 402http://stickyjs.com/ 403------------------------------------------------ 404*/ 405 406$('#main-navigation').sticky({ topSpacing: 0 }); 407 408 409/* 410------------------------------------------------ 411SMOOTH SCROLLING - SCROLL TO SOMETHING 412------------------------------------------------ 413*/ 414 415$('#main-menu a[href^="#"], .contact-button a, .scroll-arrow a').click(function(event) { 416 var id = $(this).attr("href"); 417 var offset = 50; 418 var target = $(id).offset().top - offset; 419 $('html, body').animate({scrollTop:target}, 1500, 'easeInOutQuart'); 420 event.preventDefault(); 421}); 422 423 424/* 425------------------------------------------------ 426CONTACT FORM 427------------------------------------------------ 428*/ 429 430$('#send_message').click(function(e){
431 432 //stop the form from being submitted 433 e.preventDefault(); 434 435 /* declare the variables, var error is the variable that we use on the end 436 to determine if there was an error or not */ 437 var error = false; 438 var fname = $('#fname').val(); 439 var lname = $('#lname').val(); 440 var email = $('#email').val(); 441 var subject = $('#subject').val(); 442 var message = $('#message').val(); 443 444 /* in the next section we do the checking by using VARIABLE.length 445 where VARIABLE is the variable we are checking (like name, email), 446 length is a javascript function to get the number of characters. 447 And as you can see if the num of characters is 0 we set the error 448 variable to true and show the name_error div with the fadeIn effect. 449 if it's not 0 then we fadeOut the div( that's if the div is shown and 450 the error is fixed it fadesOut. 451 452 The only difference from these checks is the email checking, we have 453 email.indexOf('@') which checks if there is @ in the email input field. 454 This javascript function will return -1 if no occurence have been found.*/ 455 if(fname.length == 0){ 456 var error = true; 457 $('#formFirstName').removeClass('success').fadeOut(500); 458 $('#formFirstName').addClass('error').fadeIn(500); 459 }else{ 460 $('#formFirstName').removeClass('error').fadeOut(500); 461 $('#formFirstName').addClass('success').fadeIn(500); 462 } 463 if(lname.length == 0){ 464 var error = true; 465 $('#formLastName').removeClass('success').fadeOut(500); 466 $('#formLastName').addClass('error').fadeIn(500); 467 }else{ 468 $('#formLastName').removeClass('error').fadeOut(500); 469 $('#formLastName').addClass('success').fadeIn(500); 470 } 471 if(email.length == 0 || email.indexOf('@') == '-1'){ 472 var error = true; 473 $('#formEmail').removeClass('success').fadeOut(500); 474 $('#formEmail').addClass('error').fadeIn(500); 475 }else{ 476 $('#formEmail').removeClass('error').fadeOut(500); 477 $('#formEmail').addClass('success').fadeIn(500); 478 } 479 if(subject.length == 0){ 480 var error = true; 481 $('#formSubject').removeClass('success').fadeOut(500); 482 $('#formSubject').addClass('error').fadeIn(500); 483 }else{ 484 $('#formSubject').removeClass('error').fadeOut(500); 485 $('#formSubject').addClass('success').fadeIn(500); 486 } 487 if(message.length == 0){ 488 var error = true; 489 $('#formMessage').removeClass('success').fadeOut(500); 490 $('#formMessage').addClass('error').fadeIn(500); 491 }else{ 492 $('#formMessage').removeClass('error').fadeOut(500); 493 $('#formMessage').addClass('success').fadeIn(500); 494 } 495 496 //now when the validation is done we check if the error variable is false (no errors) 497 if(error == false){ 498 ohSnap('Contact form is correct. Now sending message...', 'success'); 499 //disable the submit button to avoid spamming 500 //and change the button text to Sending... 501 $('#send_message').attr({'disabled' : 'true', 'value' : 'Sending...' }); 502 503 /* using the jquery's post(ajax) function and a lifesaver 504 function serialize() which gets all the data from the form 505 we submit it to send_email.php */ 506 $.post("modules/send_email.php", $("#contact_form").serialize(),function(result){ 507 //and after the ajax request ends we check the text returned 508 if(result == 'sent'){ 509 //if the mail is sent remove the submit paragraph 510 $('#cf_submit_p').remove(); 511 //and show the mail success div with fadeIn 512 $('#mail_success').fadeIn(500); 513 $('#contact_form').fadeOut(500); 514 }else{ 515 //show the mail failed div 516 $('#mail_fail').fadeIn(500); 517 //reenable the submit button by removing attribute disabled and change the text back to Send The Message 518 $('#send_message').removeAttr('disabled').attr('value', 'Send The Message'); 519 } 520 }); 521 }else{ 522 ohSnap('Please complete the form correctly!', 'danger'); 523 } 524}); 525 526 527/* 528------------------------------------------------ 529FOOTER FLICKR 530http://www.gethifi.com/blog/a-jquery-flickr-feed-plugin 531------------------------------------------------ 532*/ 533 534$('.flickr-grid').jflickrfeed({ 535 limit: 6, 536 qstrings: { 537 id: '48681156@N03' //GET USER ID http://idgettr.com/ 538 }, 539 itemTemplate: '<li class="flickr"><a href="{{image}}" data-toggle="tooltip" data-placement="bottom" title="{{title}}"><img src="{{image_s}}"/></a></li>' 540}, function(data) { 541 $('.flickr a').tooltip(); 542}); 543 544 545 546/* 547------------------------------------------------ 548FOOTER SOCIAL ICONS HOVER EFFECT 549------------------------------------------------ 550*/ 551 552 553$( '.social ul li').hover( 554 function() { 555 $(this).addClass('animated wobble'); 556 }, function() { 557 $(this).removeClass('animated wobble'); 558 } 559); 560 561 562 563/* 564------------------------------------------------ 565SCROLL TO TOP BUTTON 566------------------------------------------------ 567*/ 568 569 570// hide #back-top first 571$("#back-top").hide(); 572 573// fade in #back-top 574$(function () { 575 $(window).scroll(function () { 576 if ($(this).scrollTop() > 500) { 577 $('#back-top').fadeIn(); 578 } else { 579 $('#back-top').fadeOut(); 580 } 581 }); 582 583 // scroll body to 0px on click 584 $('#back-top').click(function () { 585 $('body,html').animate({ 586 scrollTop: 0 587 }, 1500); 588 return false; 589 }); 590}); 591 592 593}); 594 595 596 597 598/* 599------------------------------------------------ 600BEGIN - Run Only After Entire Page Has Loaded 601------------------------------------------------ 602*/ 603$(window).bind("load", function() { 604 605 606/* 607------------------------------------------------ 608VIDEO 609https://github.com/pupunzi/jquery.mb.YTPlayer 610 611!!! UNCOMMENT BELOW LINES IF YOU WANT TO USE VIDEO HEADER 612------------------------------------------------ 613*/ 614 615/* 616//Video Player 617$('.player').mb_YTPlayer({ 618 619 videoURL:'7VsUkQK9skk', 620 containment:'#parallax-bg-1', 621 autoPlay:true, 622 mute:false, 623 repeat:true, 624 startAt:0, 625 opacity:1, 626 increaseVolumeBy: 10, // increment value; volume range is 1-100 627 showControls:true 628}); 629 630 631//Video Controls 632$( '.parallax-board').hover( 633 function() { 634 $(this).find( '.video-controls' ).removeClass('animated fadeOutDown'); 635 $(this).find( '.video-controls' ).addClass('animated fadeInUp'); 636 }, function() { 637 $(this).find( '.video-controls' ).removeClass('animated fadeInUp'); 638 $(this).find( '.video-controls' ).addClass('animated fadeOutDown'); 639 } 640); 641*/ 642 643 644 645/* 646------------------------------------------------ 647PEOPLE SAY / TWITTER CARUSEL 648http://www.owlgraphic.com/owlcarousel/ 649------------------------------------------------ 650*/ 651 652 653$('#entries-carusel').owlCarousel({ 654 655 // Most important owl features 656 items : 1, 657 singleItem : true, 658 659 //Basic Speeds 660 slideSpeed : 1000, 661 paginationSpeed : 1000, 662 663 //Autoplay 664 autoPlay : true, 665 stopOnHover : true, 666 goToFirst : true, 667 goToFirstSpeed : 1000, 668 669 // Navigation 670 navigation:false, 671 navigationText : ['<span class="sprite carusel-left"></span>','<span class="sprite carusel-right"></span>'], 672 goToFirstNav : true, 673 scrollPerPage : false, 674 675 //Pagination 676 pagination : true, 677 paginationNumbers: false, 678 679 // Responsive 680 responsive: true, 681 682 // CSS Styles 683 baseClass : "owl-carousel", 684 theme : "jerro-carusel-theme", 685 686 //Auto height 687 autoHeight : true, 688 689 690}); 691 692 693 694/* 695------------------------------------------------ 696SMOOTH SCROLLING 697------------------------------------------------ 698*/ 699 700setMenuOffset(); 701 702function setMenuOffset(){ 703 704 var windowHeight = $( window ).height();// returns height of HTML document 705 var headerHeight = $('#header').height();// returns height of #header 706 var mainNavOffset = windowHeight-headerHeight; 707 $('#parallax-bg-1').css("height", mainNavOffset);// sets new height of #parallax-bg-1 708} 709 710 711//When resizing browser window 712$( window ).resize(function() { 713 setMenuOffset(); 714}); 715 716 717$('body').scrollspy({ target: '#main-navigation', offset: 60 });//activate scrollspy 718 719}); 720 721/* 722------------------------------------------------ 723END - Run Only After Entire Page Has Loaded 724------------------------------------------------ 725*/
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.