</ iframe ></noscript> <div class="fixed top-0 right-0 left-0" style="z-index: 556;"> <div class="bg-[#0b4e4e] py-1 shadow-lg" style="z-index: 556;"> <div class="mx-auto"> <div class="flex justify-between "> <div class="flex justify-start"> <!-- Additional content can go here --> </div> <div class="w-full flex justify-between items-center md:!px-5 px-2 custom-container1"> <div class="flex sspace-x-2 text-[10px] text-white items-center"> <i class="fa-solid fa-phone text-[13px] mr-1"></i> <span class="callus_on text-[12px] !mr-2">Call us on</span> <span class="font-[400] text-[12px]"> (+1) 888-448-7432 </span> </div> <ul class="flex md:space-x-4 space-x-2 md:!text-sm text-[10px]"> <li><a href="/faq" class="text-white hover:underline">Faq</a></li> <li><a href="/about-us" class="text-white hover:underline">About Us</a></li> <li><a href="http://blog.guruface.com" class="text-white hover:underline">Blog</a></li> <li><a href="/contact-us" class="text-white hover:underline">Contact Us</a></li> </ul> </div> </div> </div> </div> <!-- For Large Screens header Homelayout--> <div class="lg:flex flex-col hidden"> <nav class="bg-black shadow-lg !w-full justify-center" style="z-index: 555;"> <div class="mx-auto flex items-center lg:justify-between justify-end p-0 custom-container py-1 "> <!-- LoggedUserHiddenVars Partial --> <div class="hidden lg:flex w-full items-center"> <!-- Main Search Component --> <div class="w-full"> <main-search class="w-full"></main-search> </div> <!-- For Large Screens --> <div class="hidden lg:flex items-center"> <style> .Image-icon-xs { height: 40px; width: 40px; } .topdrpheadercolor { background: black; color: white; } .topdrpCard-top { border-top: 4px solid #00b9bd; } .viewcartdrp-menu { left: auto; right: 21%; min-width: 25%; } .cartitemscount { border-radius: 50%; color: #fff; display: inline-block; font-size: 12px; height: 18px; line-height: 16px; padding: 2px; position: relative; text-align: center; float: right; min-width: 20px; background: red; } </style> <ul class="flex space-x-2 my-1 "> <li> <a class="inline-flex items-center px-4 py-[10px] text-white border border-orange-500 bg-[#000]-600 rounded-[4px] text-sm font-semibold transition duration-200 whitespace-nowrap" href="/account/login"> Login </a> </li> <li> <a class="inline-flex items-center px-4 py-[10px] text-white border border-orange-500 bg-[#e56932] rounded-[4px] text-sm font-semibold transition duration-200 whitespace-nowrap" href="/Account/Register"> Get Started </a> </li> </ul> <div id="changeCompanyModal" class="normal-width-popup" style="display:none;"> <div class="modal-overlay"> <div class="modal-container lg:w-[70%] w-full"> <div class="modal-content mt-[15px]"> <div class="modal-header"> <h3 class="text-2xl font-semibold p-3 py-4">Change Company</h3> <button class="p-0 ml-auto bg-transparent border-0 text-black float-right text-3xl leading-none font-semibold outline-none focus:outline-none" id="CloseModelIcon" onclick="closeChangeCompany()"> <span id="popupCloseIcon" class="text-white text-2xl block outline-none focus:outline-none p-3 py-4 bg-[#c94d4d] rounded-tr-lg">×</span> </button> </div> <div> <app-change-company></app-change-company> </div> </div> </div> </div> </div> <script> document.addEventListener("DOMContentLoaded", function () { // Get modal elements const changeCompanyModal = document.getElementById("changeCompanyModal"); const closeModelIcon = document.getElementById("CloseModelIcon"); // Get dropdown elements const cartButton = document.getElementById("cartButton"); const cartDropdown = document.getElementById("cartDropdown"); const topHeaderIcon = document.getElementById("topHeaderIcon"); const topHeaderdropdown = document.getElementById("topHeaderdropdown"); const closeDropdownIcon = document.getElementById("closeDropdown"); // Open modal function function openChangeCompany() { if (changeCompanyModal) { changeCompanyModal.style.display = "block"; } } // Close modal function function closeChangeCompany() { if (changeCompanyModal) { changeCompanyModal.style.display = "none"; } } // Close modal when clicking the close icon if (closeModelIcon && changeCompanyModal) { closeModelIcon.addEventListener("click", function () { changeCompanyModal.style.display = "none"; }); } // Toggle cart dropdown visibility if (cartButton && cartDropdown) { cartButton.addEventListener("click", function (e) { e.stopPropagation(); const isVisible = cartDropdown.classList.contains("opacity-100"); cartDropdown.classList.toggle("opacity-100", !isVisible); cartDropdown.classList.toggle("visible", !isVisible); cartDropdown.classList.toggle("opacity-0", isVisible); cartDropdown.classList.toggle("invisible", isVisible); }); } // Toggle top header dropdown visibility if (topHeaderIcon && topHeaderdropdown) { topHeaderIcon.addEventListener("click", function (e) { e.stopPropagation(); const isVisible = topHeaderdropdown.classList.contains("opacity-100"); topHeaderdropdown.classList.toggle("opacity-100", !isVisible); topHeaderdropdown.classList.toggle("visible", !isVisible); topHeaderdropdown.classList.toggle("opacity-0", isVisible); topHeaderdropdown.classList.toggle("invisible", isVisible); }); } // Close dropdowns when clicking outside document.addEventListener("click", function () { if (cartDropdown) { cartDropdown.classList.add("opacity-0", "invisible"); cartDropdown.classList.remove("opacity-100", "visible"); } if (topHeaderdropdown) { topHeaderdropdown.classList.add("opacity-0", "invisible"); topHeaderdropdown.classList.remove("opacity-100", "visible"); } }); // Close cart dropdown when clicking the close icon if (closeDropdownIcon && cartDropdown) { closeDropdownIcon.addEventListener("click", function () { cartDropdown.classList.add("opacity-0", "invisible"); cartDropdown.classList.remove("opacity-100", "visible"); }); } }); </script> <!-- Show on large screens --> </div> </div> </div> </nav> </div> <!-- For Small Screens header Homelayout --> <div class="lg:hidden block bg-white border-b border-[#1f9980] bg-[#f5fffd]" style="z-index: 555;"> <div class="w-full flex justify-center items-start relative gap-0.5 pr-2"> <div class="w-full"> <app-category-menuv2></app-category-menuv2> </div> <div class="text-start flex pt-[8px]"> <!-- For Small Screens --> <div class="lg:hidden flex justify-end"> <style> .Image-icon-xs { height: 40px; width: 40px; } .topdrpheadercolor { background: black; color: white; } .topdrpCard-top { border-top: 4px solid #00b9bd; } .viewcartdrp-menu { left: auto; } .drpMenuLeft { left: auto; right: 0; } .moreLinks .dropdown-toggle::after { display: none; } .moreLinks .dropdown-menu { min-width: 15rem; } .moreLinks small { font-size: 65%; } .cursor-pointer { position: relative; z-index: 10; } </style> <div class="flex gap-1 items-center"> <!-- Login Button --> <div class="my-auto"> <a href="/account/login" class="inline-flex items-center justify-center px-1.5 py-2 border bg-white border-orange-500 text-orange-500 rounded-md hover:bg-orange-500 hover:text-white transition-colors duration-200" title="Login"> <i class="fa-solid fa-right-to-bracket"></i> </a> </div> <!-- Register Button --> <div class="my-auto"> <a href="/account/register" class="inline-flex items-center justify-center px-1.5 py-2 border hover:bg-white border-[#6dd5c0] hover:!text-[#6dd5c0] rounded-md bg-[#6dd5c0] text-white transition-colors duration-200" title="Register"> <i class="fa-solid fa-user-plus"></i> </a> </div> </div> <div id="changeCompanyModalsmall" class="normal-width-popup hidden"> <div class="modal-overlay"> <div class="modal-container lg:w-[70%] w-full"> <div class="modal-content mt-[15px]"> <div class="modal-header"> <h3 class="text-2xl font-semibold p-3 py-4">Change Company</h3> <button class="p-0 ml-auto bg-transparent border-0 text-black float-right text-3xl leading-none font-semibold outline-none focus:outline-none" id="CloseModelIconsmall" onclick="closeChangeCompanySmall()"> <span id="popupCloseIconsmall" class="text-white text-2xl block outline-none focus:outline-none p-3 py-4 bg-[#c94d4d] rounded-tr-lg">×</span> </button> </div> <div> <app-change-company></app-change-company> </div> </div> </div> </div> </div> <script> function openChangeCompanySmall() { const modal = document.getElementById('changeCompanyModalsmall'); if (modal) { console.log('Opening modal', modal); modal.classList.remove("hidden"); modal.classList.add("block"); } } function closeChangeCompanySmall() { const modal = document.getElementById('changeCompanyModalsmall'); if (modal) { console.log('Closing modal', modal); modal.classList.remove("block"); modal.classList.add("hidden"); } } document.addEventListener("DOMContentLoaded", function () { const toggleButton = document.getElementById("dropdownToggle"); const dropdownContent = document.getElementById("dropdownContent"); const dropdownButton = document.getElementById('dropdownheaderButton'); const dropdownMenu = document.getElementById('dropdownMenu'); const topHeaderIcon = document.getElementById('topHeaderIcon'); const closeModelIcon = document.getElementById('CloseModelIcon'); const topHeaderdropdown = document.getElementById('topHeaderdropdown'); // Toggle top header dropdown visibility if (dropdownButton && topHeaderdropdown) { dropdownButton.addEventListener('click', function (e) { e.stopPropagation(); const isVisible = topHeaderdropdown.classList.contains('opacity-100'); topHeaderdropdown.classList.toggle('opacity-100', !isVisible); topHeaderdropdown.classList.toggle('visible', !isVisible); topHeaderdropdown.classList.toggle('opacity-0', isVisible); topHeaderdropdown.classList.toggle('invisible', isVisible); }); } // Toggle dropdown visibility if (toggleButton && dropdownContent) { toggleButton.addEventListener("click", function (event) { event.stopPropagation(); dropdownContent.classList.toggle("hidden"); if (dropdownMenu) dropdownMenu.classList.add("hidden"); }); } // Toggle dropdown menu visibility if (dropdownButton && dropdownMenu) { dropdownButton.addEventListener("click", function (event) { event.stopPropagation(); dropdownMenu.classList.toggle("hidden"); }); } // Close all dropdowns when clicking outside document.addEventListener("click", function () { if (dropdownContent) dropdownContent.classList.add("hidden"); if (dropdownMenu) dropdownMenu.classList.add("hidden"); if (topHeaderdropdown) { topHeaderdropdown.classList.add('opacity-0', 'invisible'); topHeaderdropdown.classList.remove('opacity-100', 'visible'); } }); // Close dropdowns when clicking inside if (dropdownContent) { dropdownContent.addEventListener("click", function () { dropdownContent.classList.add("hidden"); }); } if (dropdownMenu) { dropdownMenu.addEventListener("click", function () { dropdownMenu.classList.add("hidden"); }); } }); </script> <!-- Show on small screens --> </div> </div> </div> </div> </div> <div class="hidden lg:block items-center md:!pt-[85px]"> <app-category-menuv2></app-category-menuv2> </div> <input type="hidden" id="PageType" data-value="FeaturedCourses" /> <input type="hidden" id="categoryId" data-value="74" /> <input type="hidden" id="categoryName" data-value="Java J2EE Programming" /> <script src="/js/tailwind/tailwind.js"></script> <style> .outer-wrapper { background: white; } .categorytext { font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 2.2rem; line-height: 1.1; } .featured_heading_fonts { color: #000; letter-spacing: -1px; font-weight: bold; font-family: 'SF Pro Text', -apple-system, BlinkMacSystemFont, Roboto, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; } .categorytext { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 2.2rem; line-height: 1.1; } </style> <!-- PAGE HEADER --> <nav aria-label="breadcrumb" class="bg-[#e9ecef] py-3"> <div class=""> <ol class="flex flex-wrap text-sm text-gray-600 mx-4 md:mx-[3rem] lg:mx-12 xl:mx-[6rem] 2xl:mx-[9rem]"> <li class="flex items-center"> <a href="/" class="flex items-center text-blue-600 hover:underline"> <i class="fa fa-home mr-1"></i> Home </a> <span class="mx-2">/</span> </li> <li class="flex items-center text-gray-500" aria-current="page"> Courses </li> </ol> </div> </nav> <div class="bg-[#e1f9f7]"> <div class="custom-container"> <div class="py-4"> <div class="flex flex-col-reverse md:flex-row items-center"> <!-- Text Section --> <div class="w-full md:w-7/12 md:order-1"> <h1 class="text-white text-3xl md:text-5xl font-sans"> <span class="featured_heading_fonts">Find the best <br />Courses in</span> <span class="categorytext categoryBannerCategoryName font-bold text-[#5fc3ae]">Java J2EE Programming</span> </h1> <p class="text-gray-800 text-justify mt-6 leading-7"> Java is seen on many computers these days, and if you do not know how to run it, it can cause some problems. Do not get caught behind without any Java training under your belt. Sign up for online Java J2EE courses today to get ready to learn J2EE! </p> </div> <!-- Image Section --> <div class="w-full md:w-5/12 md:order-2 flex justify-center mb-6 md:mb-0"> <span class="icon-category"> <img src="https://cdn-images-gf-dev.azureedge.net/categories/icon-category-programminglanguages.png" alt="Category Icon" height="300" width="350" class="border border-gray-300 object-contain" /> </span> </div> </div> </div> </div> </div> <!-- 404 ERROR CONTENT --> <div class="search-container category-programminglanguages-theme popularsearchtags_categires "> <div> <Featured-Entities></Featured-Entities> </div> </div> <link rel="stylesheet" href="/css/featured-entities-app.css" /> <script src="/js/featured-entities-app.js"></script> <div class="bg-gray-900 text-white pt-5 pb-5"> <div class="custom-container px-4"> <div class="flex flex-wrap -mx-4"> <!-- About Company --> <div class="w-full lg:w-5/12 px-4 mb-8 lg:mb-0"> <h4 class="text-lg font-semibold">ABOUT US</h4> <a href="/about-us"> <img src="https://cdn-images-gf-dev.azureedge.net/GuruFaceLogo.png" class="mt-4 p-1 rounded w-[72px] bg-[#f8f9fa]" alt="Logo"> </a> <p class="mt-4 text-muted"> Guruface is your complete online platform for learning, teaching, and training. Our mission is to provide a state-of-the-art online training platform for students, freelance teachers, corporate trainers, and small to mid-size companies worldwide. </p> <p class="mt-2 "> We have a foundation of highly talented professional trainers who specialize in a variety of subject areas. </p> <div class="mt-4 space-x-3"> <a href="#" class="text-gray-400 hover:text-gray-200"><i class="fa fa-facebook-square"></i></a> <a href="#" class="text-gray-400 hover:text-gray-200"><i class="fa fa-linkedin-square"></i></a> </div> <a href="/about-us" class="mt-4 inline-block px-4 py-2 border border-yellow-400 text-yellow-400 rounded hover:bg-yellow-400 hover:text-gray-900 transition duration-300">Read More</a> </div> <!-- Links --> <div class="w-full lg:w-3/12 px-4 mb-8 lg:mb-0"> <h4 class="text-lg font-semibold mt-4 lg:mt-0">Links</h4> <ul class="mt-4 space-y-2 text-[#007bff]"> <li><a href="/faq" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>FAQs</a></li> <li><a href="/contact-us" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Contact Us</a></li> <li><a href="/about-us" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>About Us</a></li> <li><a href="http://blog.guruface.com/" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Blogs</a></li> <li><a href="/find-courses" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Courses</a></li> <li><a href="/training-events" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Events</a></li> <li><a href="/find-trainers" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Trainers</a></li> <li><a href="/find-trainer-jobs" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Jobs</a></li> <li><a href="/practice-exams" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Practice Exams</a></li> <li><a href="/knowledge-tests" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Knowledge Tests</a></li> <li><a href="/masterclasses" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Master Classes</a></li> <li><a href="/learningpaths" class="hover:text-gray-200"><i class="fa fa-angle-right mr-2"></i>Learning Paths</a></li> </ul> </div> <!-- Location --> <div class="w-full lg:w-4/12 px-4"> <h4 class="text-lg font-semibold mt-4 lg:mt-0">Location</h4> <p class="mt-4 text-gray-400">P O Box 1843<br>Frisco<br>Texas 75034</p> <a href="tel:(+1) 888-448-7432" class="mt-4 text-[#007bff]"><i class="fa fa-phone mr-2"></i>(+1) 888-448-7432</a><br /> <a href="mailto:info@guruface.com" class="text-[#007bff]"><i class="fa fa-envelope mr-2"></i>info@guruface.com</a> </div> </div> <!-- Copyright --> <div class="border-t border-gray-800 mt-5 pt-4"> <p class="text-center text-muted text-sm"> © Copyright 2025 Guruface Inc. Designed by <a href="https://www.guruface.com" class="text-[#007bff] hover:underline">Guruface Inc.</a> </p> </div> </div> </div> </body> </html>