관리-도구
편집 파일: project.html
<!DOCTYPE html> <html lang="en"> <head> <!-- META --> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="keywords" content=""> <meta name="author" content=""> <meta name="robots" content=""> <meta name="description" content=""> <!-- FAVICONS ICON --> <link rel="icon" href="images/logo/logo.png" type="image/x-icon"> <link rel="shortcut icon" type="image/x-icon" href="images/logo/logo.png"> <!-- PAGE TITLE HERE --> <title>MasterTech | Project</title> <!-- MOBILE SPECIFIC --> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="css/bootstrap.min.css"><!-- BOOTSTRAP STYLE SHEET --> <link rel="stylesheet" href="css/font-awesome.min.css"><!-- FONTAWESOME STYLE SHEET --> <link rel="stylesheet" href="css/owl.carousel.min.css"><!-- OWL CAROUSEL STYLE SHEET --> <link rel="stylesheet" href="css/magnific-popup.min.css"><!-- MAGNIFIC POPUP STYLE SHEET --> <link rel="stylesheet" href="css/swiper-bundle.min.css"><!-- Link Swiper's CSS --> <link rel="stylesheet" href="css/style.css"><!-- MAIN STYLE SHEET --> <link rel="stylesheet" href="css/bootstrap-icons.css"><!-- BOOTSTRAP ICON STYLE SHEET --> <link rel="stylesheet" href="css/lc_lightbox.css"><!-- Lc light box popup --> <link rel="stylesheet" href="css/bootstrap-slider.min.css"><!-- Price Range Slider --> </head> <body> <!-- LOADING AREA START ===== --> <div class="loading-area"> <div class="loading-box"></div> <div class="loading-pic"> <div class="loader"></div> </div> </div> <!-- LOADING AREA END ====== --> <!-- Curser Pointer --> <div class="cursor"></div> <div class="cursor2"></div> <div class="page-wraper"> <!-- HEADER START --> <header class="sticky-header site-header header-style-2 mobile-sider-drawer-menu"> <div class="main-bar-wraper navbar-expand-lg"> <div class="main-bar"> <div class="container-fluid clearfix"> <div class="logo-header"> <div class="logo-header-inner logo-header-one"> <a href="index.html"> <img src="images/logo/logo.png" alt="" width="200px"> </a> </div> </div> <!-- NAV Toggle Button --> <button id="mobile-side-drawer" data-target=".header-nav" data-toggle="collapse" type="button" class="navbar-toggler collapsed"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar icon-bar-first"></span> <span class="icon-bar icon-bar-two"></span> <span class="icon-bar icon-bar-three"></span> </button> <!-- MAIN Vav --> <div class="nav-animation header-nav navbar-collapse collapse d-flex justify-content-end"> <ul class=" nav navbar-nav"> <li><a href="index.html">Home</a></li> <li><a href="about.html">About</a></li> <li><a href="services.html">Services</a></li> <li><a href="sectors.html">Sectors</a></li> <li><a href="project.html">Projects</a></li> <li><a href="gallery.html">Gallery</a></li> <li><a href="clients.html">Clients</a></li> <li><a href="blog.html">Blogs</a></li> <li><a href="products.html">Products</a></li> <li><a href="contact.html">Contact</a></li> </ul> </div> <!-- Header Right Section--> <div class="extra-nav header-1-nav"> <div class="extra-cell one"> <div class="header-search"> <a href="#search" class="header-search-icon"><i class="bi bi-search"></i></a> </div> </div> <div class="extra-cell two h-cart-block"> <a href="javascript:;" class="wt-cart cart-btn navSidebar-button" title="Your Cart"> <span class="link-inner"> <span class="woo-cart-total"> </span> <span class="woo-cart-count"> <i class="fa-solid fa-phone-volume fa-lg"></i> </span> </span> </a> </div> </div> <!-- SITE Search --> <div id="search"> <span class="close-btn">X</span> <form role="search" id="searchform" action="/search" method="get" class="radius-xl"> <div class="input-group"> <input class="form-control" value="" name="q" type="search" placeholder="Search..."> <span class="input-group-append"> <button type="button" class="search-btn"> <i class="bi bi-search"></i> </button> </span> </div> </form> </div> </div> </div> </div> <!-- Sidebar popup Item --> <div class="xs-sidebar-group info-group"> <div class="xs-overlay xs-bg-black"></div> <div class="xs-sidebar-widget"> <div class="sidebar-widget-container"> <div class="widget-heading"> <a href="#" class="close-side-widget"> <i class="bi bi-x-square-fill"></i> </a> </div> </div> </div> </div> <!--End Sidebar popup Item --> </header> <!-- HEADER END --> <!-- CONTENT START --> <div class="page-content"> <!-- INNER PAGE BANNER --> <!-- INNER PAGE BANNER END --> <!-- PROJECT SECTION START --> <div class="section-full p-t90 p-b90"> <div class="container-fluid"> <div class="section-head center wt-small-separator-outer"> <div class="wt-small-separator site-text-primary"> <i class="bi bi-house"></i> <div>Our Projects</div> </div> <h2 class="wt-title title_split_anim">Projects</h2> </div> <!-- TAB MENU --> <ul class="nav nav-tabs justify-content-center mb-5 masonry-filter" id="projectTab" role="tablist"> <li class="nav-item"> <a class="nav-link active" id="photos-tab" data-bs-toggle="tab" href="#photos" role="tab" aria-controls="photos" aria-selected="true">Photos</a> </li> <li class="nav-item"> <a class="nav-link" id="videos-tab" data-bs-toggle="tab" href="#videos" role="tab" aria-controls="videos" aria-selected="false">Videos</a> </li> </ul> <!-- TAB CONTENT --> <div class="tab-content" id="projectTabContent"> <!-- PHOTOS TAB --> <div class="tab-pane fade show active" id="photos" role="tabpanel" aria-labelledby="photos-tab"> <!-- FILTER MENU --> <div class="filter-wrap text-center mb-4"> <ul class="masonry-filter d-inline-block"> <li class="active"><a data-filter="*" href="#">All</a></li> <li><a data-filter=".cat-1" href="#">SMATV MATV System</a></li> <li><a data-filter=".cat-2" href="#">CCTV Installation</a></li> <li><a data-filter=".cat-3" href="#">Parking Gate Barrier</a></li> <li><a data-filter=".cat-4" href="#">Time Attendance System</a></li> <li><a data-filter=".cat-5" href="#">Wifi Solutions</a></li> </ul> </div> <!-- PHOTO GRID --> <div class="masonry-wrap row clearfix d-flex justify-content-center flex-wrap"> <!-- Example Photo Item --> <div class="masonry-item cat-1 col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect"> <img src="images/mastertech/pro1.png" alt=""> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="project-single.html">Habtoor Grand Resort and SPA Jumeirah Beach, Dubai</a></h3> <p>Supply and installation of CCTV Cameras, Audio/Video system, SMATV system along with maintenance.</p> </div> </div> </div> <!-- COLUMNS 2 --> <div class="masonry-item cat-2 col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect"> <img src="images/mastertech/pro2.png" alt=""> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="project-single.html">Al Forsan Real Estate Consultant :WS Atkins & Partners Overseas</a></h3> <p>Supply and Installation of SMATV, RF head System & IF system for Studion Cluster1, 6 Building and Club House + Villa cluster 4,5A & 5B</p> </div> </div> </div> <!-- COLUMNS 3 --> <div class="masonry-item cat-3 col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect"> <img src="images/mastertech/pro3.png" alt=""> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="project-single.html">Al Futtaim Engineering Company LLC Dubai</a></h3> <p>Supply, installation and maintenance of CCTV cameras and Dish Antenna system, Audio/video system Accessories</p> </div> </div> </div> <!-- COLUMNS 4 --> <div class="masonry-item cat-4 col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect"> <img src="images/mastertech/pro4.png" alt=""> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="project-single.html">HYUNDAI Construction and Engineering Abu-Dhabi</a></h3> <p>Supply and Installation and commissioning of Truman Receiver, Multi Switch, Dish Antenna at Korean Accommodation.</p> </div> </div> </div> <!-- COLUMNS 5 --> <div class="masonry-item cat-5 col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect"> <img src="images/mastertech/pro5.png" alt=""> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="project-single.html">Union Tower Sheikh Zaid Road, Dubai</a></h3> <p>Supply and installation and commissioning of SMATV IF distribution system.</p> </div> </div> </div> <!-- COLUMNS 6 --> <div class="masonry-item cat-1 col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect"> <img src="images/mastertech/pro6.png" alt=""> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="project-single.html">NBB workers City Abu-Dhabi</a></h3> <p>Supply and installation of RF System for 24 Buildings</p> </div> </div> </div> <!-- COLUMNS 7 --> <div class="masonry-item cat-2 col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect"> <img src="images/mastertech/pro1.png" alt=""> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="project-single.html">Al Marwa Tower Sharjah</a></h3> <p>Supply and installation of SMATV System</p> </div> </div> </div> <!-- COLUMNS 8 --> <div class="masonry-item cat-3 col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect"> <img src="images/mastertech/pro2.png" alt=""> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="project-single.html">NEW AGE TECH Dubai</a> </h3> <p>Supply and Installation of BG Music System Audio/Video</p> </div> </div> </div> <!-- (Repeat your other photo items here — unchanged) --> </div> </div> <!-- VIDEOS TAB --> <div class="tab-pane fade" id="videos" role="tabpanel" aria-labelledby="videos-tab"> <div class="masonry-wrap row clearfix d-flex justify-content-center flex-wrap"> <!-- VIDEO 1 --> <div class="masonry-item col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect video-box"> <iframe width="100%" height="200" src="https://www.youtube.com/embed/TcMBFSGVi1c" title="Project Video 1" frameborder="0" allowfullscreen></iframe> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="#">CCTV Installation Walkthrough</a></h3> <p>Step-by-step installation and testing process for our Dubai project.</p> </div> </div> </div> <!-- VIDEO 2 --> <div class="masonry-item col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect video-box"> <video width="100%" height="200" controls> <source src="videos/project2.mp4" type="video/mp4"> Your browser does not support the video tag. </video> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="#">SMATV System Setup</a></h3> <p>Live demo showing SMATV system configuration and distribution testing. </p> </div> </div> </div> <!-- VIDEO 3 --> <div class="masonry-item col-xl-3 col-lg-4 col-md-6 m-b30"> <div class="project-new-2"> <div class="wt-img-effect video-box"> <iframe width="100%" height="200" src="https://www.youtube.com/embed/ScMzIvxBSi4" title="Project Video 3" frameborder="0" allowfullscreen></iframe> </div> <div class="project-new-content"> <h3 class="wt-title"><a href="#">Time Attendance Integration</a></h3> <p>Overview of attendance and security integration at site.</p> </div> </div> </div> </div> </div> </div> <!-- END TAB CONTENT --> </div> </div> <!-- PROJECT SECTION END --> <!-- Include Bootstrap JS and Isotope for filtering --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script> <script> // Masonry filtering var $grid = $('.masonry-wrap').isotope({ itemSelector: '.masonry-item', layoutMode: 'fitRows' }); $('.masonry-filter a').on('click', function (e) { e.preventDefault(); $('.masonry-filter li').removeClass('active'); $(this).parent().addClass('active'); var filterValue = $(this).attr('data-filter'); $grid.isotope({ filter: filterValue }); }); // Reinitialize Isotope when switching tabs $('a[data-bs-toggle="tab"]').on('shown.bs.tab', function () { $grid.isotope('layout'); }); </script> <!-- LATEST PROJECTS SLIDER END --> </div> <!-- CONTENT END --> <!-- FOOTER START --> <footer class="site-footer footer-dark"> <!-- FOOTER BLOCKES START --> <div class="footer-top"> <div class="container"> <div class="row"> <div class="col-lg-4 col-md-12"> <div class="widget widget_about"> <div class="logo-footer clearfix"> <a href="index.html"><img src="images/logo/logo.png" alt=""></a> </div> <div class="call-us"> <a href="tel:+971 558053688">+971 558053688</a> </div> <p class="text-dark">Comprehensive ELV & Communication Solutions: Specializing in SMATV/IPTV, CCTV, Audio Video Intercom, Access Control, and Gate Barrier Systems since 2005. </p> <ul class="social-icons"> <li><a class="text-white" href="https://www.x.com"><i class="bi bi-twitter-x cursor-scale small"></i></a></li> <li><a class="text-white" href="https://www.facebook.com "><i class="bi bi-facebook cursor-scale small"></i></a></li> <li><a class="text-white" href="https://www.instagram.com"><i class="bi bi-instagram cursor-scale small"></i></a></li> <li><a class="text-white" href="https://www.pinterest.com/"><i class="bi bi-pinterest cursor-scale small"></i></a></li> </ul> </div> </div> <div class="col-lg-4 col-md-6"> <div class="widget f-top-space"> <h3 class="widget-title text-dark">Address</h3> <ul class="widget_address"> <li class="text-dark"><i class="bi bi-geo-alt"></i> <span class="text-dark">UAE</span> Master Technovision LLC Showroom | WH No.E18 Nr. Jotun Paints, Al Quoz 2, Dubai, UAE </li> <li class="text-dark"> <i class="bi bi-telephone-fill me-2"></i> +971 558053688 </li> <li class="text-dark"><i class="bi bi-envelope"></i>info@mastertechuae.com</li> </ul> </div> </div> <div class="col-lg-4 col-md-6"> <div class="widget f-top-space recent-posts-entry"> <h3 class="widget-title text-dark">Recent Blogs</h3> <div class="section-content"> <div class="widget-post-bx"> <div class="widget-post clearfix"> <div class="wt-post-media"> <img src="images/mastertech/b1.png" alt=""> </div> <div class="wt-post-info"> <div class="wt-post-meta"> <ul> <li class="post-author">25 May</li> <li class="post-comment">05 Comment</li> </ul> </div> <div class="wt-post-header"> <a class="text-dark" href="blog-single.html" class="post-title">Office Turnkey Solutions in Dubai – Smart Office Setup</a> </div> </div> </div> <div class="widget-post clearfix"> <div class="wt-post-media"> <img src="images/mastertech/b3.png" alt=""> </div> <div class="wt-post-info"> <div class="wt-post-meta"> <ul> <li class="post-author">28 June</li> <li class="post-comment">05 Comment</li> </ul> </div> <div class="wt-post-header"> <a class="text-dark" href="blog-single.html" class="post-title">Mild Sound Systems Installation in Dubai: Elevate Your Audio Experience</a> </div> </div> </div> <div class="widget-post clearfix"> <div class="wt-post-media"> <img src="images/mastertech/b4.png" alt=""> </div> <div class="wt-post-info"> <div class="wt-post-meta"> <ul> <li class="post-author">28 June</li> <li class="post-comment">05 Comment</li> </ul> </div> <div class="wt-post-header"> <a class="text-dark" href="blog-single.html" class="post-title">The Journey of MasterTech</a> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <!-- FOOTER COPYRIGHT --> <div class="footer-bottom"> <div class="container"> <div class="container"> <div class="footer-bottom-info d-flex justify-content-between"> <div class="wt-footer-bot-left"> <span class="copyrights-text">© 2025 Mastertech Copyright Reserved.</span> </div> <div class="wt-footer-bot-right"> <span class="copyrights-text">Designed By ICT Global Tech Pvt Ltd</span> </div> </div> </div> </div> </div> </footer> <!-- FOOTER END --> <!-- BUTTON TOP START --> <button class="scroltop"><span class="fa fa-angle-up relative" id="btn-vibrate"></span></button> </div> <!-- JAVASCRIPT FILES ========================================= --> <script src="js/jquery-3.7.1.min.js"></script><!-- JQUERY.MIN JS --> <script src="js/popper.min.js"></script><!-- POPPER.MIN JS --> <script src="js/bootstrap.min.js"></script><!-- BOOTSTRAP.MIN JS --> <script src="js/magnific-popup.min.js"></script><!-- MAGNIFIC-POPUP JS --> <script src="js/waypoints.min.js"></script><!-- WAYPOINTS JS --> <script src="js/counterup.min.js"></script><!-- COUNTERUP JS --> <script src="js/isotope.pkgd.min.js"></script><!-- MASONRY --> <script src="js/imagesloaded.pkgd.min.js"></script><!-- MASONRY --> <script src="js/owl.carousel.min.js"></script><!-- OWL SLIDER --> <script src="js/theia-sticky-sidebar.js"></script><!-- STICKY SIDEBAR --> <script src="js/jquery.bootstrap-touchspin.js"></script><!-- FORM JS --> <script src="js/lc_lightbox.lite.js"></script><!-- IMAGE POPUP --> <script src="js/bootstrap-slider.min.js"></script><!-- Form js --> <script src="js/swiper-bundle.min.js"></script> <!-- Swiper JS --> <script src="js/img-parallax.js"></script> <script src="js/wow.min.js"></script><!-- WOW ANIMATION JS --> <!-- Title animation Js --> <script src="js/gsap.min.js"></script><!-- cursor --> <script src="js/custom.js"></script><!-- CUSTOM FUCTIONS --> </body> </html>