* {
margin: 0;
padding: 0;
}
a {
text-decoration: underline;
color: #0F8C8C;
}
a:hover {
text-decoration: none;
}
body {
line-height: 1.75em;
background: url("../images/obg.png");
background-repeat:no-repeat;
background-size:cover;
background-attachment: fixed;
}
body,input {
font-family: "Times New Roman", Times, serif;
}
strong {
color: #000000;
}
br.clearfix {
clear: both;
}
h1,h2,h3,h4 {
font-weight: normal;
}
h2 {
font-size: 2.25em;
}
h2,h3,h4 {
color: #2C2B2B;
margin-bottom: 1em;
}
h3 {
font-size: 1.75em;
}
h4 {
font-size: 1.5em;
}
img.alignleft {
margin: 5px 20px 20px 0;
float: left;
}
img.aligntop {
margin: 5px 0 20px 0;
}
img.pic {
padding: 5px;
border: solid 1px #D4D4D4;
}
p {
margin-bottom: 1.5em;
}
ul {
margin-bottom: 1.5em;
}
ul h4 {
margin-bottom: 0.35em;
}
.box {
overflow: hidden;
margin-bottom: 1em;
}
.date {
background: #6E6E6E;
padding: 5px 6px 5px 6px;
margin: 0 6px 0 0;
color: #FFFFFF;
font-size: 0.8em;
border-radius: 2px;
}
#content {
width: 665px;
float: left;
padding: 0;
position: relative;
}
#content-box1 {
width: 320px;
float: left;
}
#content-box2 {
margin: 0 0 0 345px;
width: 320px;
}
#footer {
margin: 40px 0 120px 0;
text-align: center;
color: #000000;
}
#footer a {
color: #000000;
}
#header {
height: 75px;
position: relative;
padding: 45px;
color: #FFFFFF;
width: 888px;
overflow: hidden;
}
li.dropdown {
display: inline-block;
}
li a:hover, .dropdown:hover .dropbtn {
}
.dropdown-content {
background: url('../images/nav.png');
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
z-index: 1;
}
.dropdown-content a {
color: black;
text-decoration: none;
display: block;
text-align: center;
border: thin solid #000000;
}
.dropdown:hover .dropdown-content {
}
.show {display:block;}
#menu {
padding: 0 45px 0 45px;
position: relative;
background: url('../images/nav.png');
margin: 0 0 0 0;
height: 60px;
line-height: 60px;
width: 890px;
border-top: 1px solid #000000;
}
#menu a {
text-decoration: none;
color: #000000;
font-weight: bold;
font-size: large;
font-family: "Times New Roman", Times, serif;
}
#menu ul {
display: table;
width: 100%;
list-style: none;
margin: 0;
padding: 0;
}
#menu ul li {
display: table-cell;
background-position: 0 -118px;
background-repeat: no-repeat;
height: 49px;
width: 122px;
margin: 0;
padding-left: 1px;
text-align: center;
}
#menu ul li.first {
padding-left: 0;
}
#page {
background: url('../images/lgcont.jpg');
padding: 45px 45px 15px 45px;
position: relative;
width: 890px;
margin: 0;
}
#page .section-list {
list-style: none;
padding-left: 0;
}
#page .section-list li {
clear: both;
padding: 30px 0 30px 0;
}
#page ul {
list-style: none;
}
#page ul li {
border-top: solid 1px #D4D4D4;
padding: 15px 0 15px 0;
}
#page ul li.first {
padding-top: 0;
border-top: 0;
}
#page-bottom {
position: relative;
margin: 0;
background: #000000 url('../images/banner2.jpg') no-repeat left top;
width: 890px;
height: 200px;
padding: 45px 45px 0 45px;
color: #000000;
}
#page-bottom a {
color: #F5F5F5;
}
#page-bottom h2, #page-bottom h3, #page-bottom h4 {
color: #FFFFFF;
}
#page-bottom ul {
list-style: none;
}
#page-bottom ul li {
border-top: solid 1px #8F8F8F;
padding: 15px 0 15px 0;
}
#page-bottom ul li.first {
padding-top: 0;
border-top: 0;
}
#page-bottom-content {
width: 665px;
float: left;
clear: right;
}
#page-bottom-sidebar {
width: 200px;
margin: 0 0 0 0;
float: right;
}
#search input.form-submit {
margin-left: 1em;
color: #FFFFFF;
padding: 10px;
background: #2FACAC;
border: 0;
}
#search input.form-text {
border: solid 1px #8F8F8F;
padding: 10px;
}
#sidebar {
position: relative;
width: 200px;
padding: 0;
margin: 0 0 0 690px;
}
#splash {
background: url('../images/lgcont.jpg');
margin: 0 0 0 0;
height: 374px;
position: relative;
padding: 45px 45px 10px 45px;
width: 890px;
}
#splash .pic {
padding: 9px;
}
#wrapper {
background: url('../images/lgcont.jpg');
border: solid 1px #000000;
background-size:cover;
position: relative;
width: 980px;
margin: 75px auto 0 auto;
background: #FFFFFF;
}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mimars Energy Sdn Berhad - Your Best Partner in Business</title>
<link rel="icon" href="images/favImage.png" type="image/png"/>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<style type="text/css">
.style6 {
font-family: "Times New Roman", Times, serif;
}
.style7 {
text-align: center;
}
.style8 {
text-align: center;
font-size: xx-large;
}
.style9 {
text-align: left;
font-family: "Times New Roman", Times, serif;
}
.style10 {
text-align: left;
}
.style13 {
text-align: center;
font-family: "Times New Roman", Times, serif;
font-size: xx-large;
}
.style15 {
text-align: center;
font-family: "Times New Roman", Times, serif;
font-size: x-large;
}
.style17 {
font-size: large;
}
.style18 {
text-align: left;
font-size: large;
}
.style19 {
font-family: "Times New Roman", Times, serif;
font-size: large;
}
.style20 {
text-align: center;
font-size: large;
}
.style21 {
text-align: center;
font-family: "Times New Roman", Times, serif;
font-size: large;
}
.style22 {
text-align: center;
font-size: small;
}
.style23 {
font-size: x-large;
}
</style>
<script>
/* When the user clicks on the button,
toggle between hiding and showing the dropdown content */
function myFunction1() {
document.getElementById("myDropdown1").classList.toggle("show");
}
function myFunction2() {
document.getElementById("myDropdown2").classList.toggle("show");
}
// Close the dropdown if the user clicks outside of it
window.onclick = function(e) {
if (!e.target.matches('.dropbtn')) {
var dropdowns = document.getElementsByClassName("dropdown-content");
for (var d = 0; d < dropdowns.length; d++) {
var openDropdown = dropdowns[d];
if (openDropdown.classList.contains('show')) {
openDropdown.classList.remove('show');
}
}
}
}
</script>
</head>
<body>
<div id="wrapper">
<div id="header" style="background-image: url('images/logo.jpg'); width: 890px">
<img height="128" src="images/logo%20spin.gif" style="position: relative; left: 12px; top: -37px;" width="128" /></div>
<div id="menu">
<ul>
<li class="first current_page_item"><span class="style6"><a href="index.html">
Home</a></li>
<li class="dropdown"><a href="javascript:void(0)" class="dropbtn" onclick="myFunction1()">Profile</a>
<div class="dropdown-content" id="myDropdown1">
<a href="profile.html">Mission & Vision</a>
<a href="license.html">License</a>
</div>
</li>
<li><a href="project.html">Project</a></li>
<li><a href="suppliers.html">Suppliers</a></li>
<li class="dropdown"><a href="javascript:void(0)" class="dropbtn" onclick="myFunction2()">Partners</a>
<div class="dropdown-content" id="myDropdown2">
<a href="internationalpartners.html">International</a>
<a href="localpartners.html">Local</a>
</div>
</li>
<li class="last"><a href="contact.html">Contact Us</a></li>
</ul>
<br class="clearfix" />
</div>
<div id="page" style="left: 0px; top: 0px; height: 1549px;">
<table style="width: 100%">
<tr>
<td class="style13">
<strong>WELCOME TO MIMARS ENERGY</strong></td>
</tr>
</table>
<span class="style6"><br />
<table style="width: 100%">
<tr>
<td colspan="4" class="style7" style="height: 269px"><span class="style6">
<iframe src="slideshow.html" frameborder="0" style="border: thin solid #000000; width: 80%; height: 354px; left: 2px; top: -2px; overflow: hidden;" allowfullscreen id="I1" class="style8" name="I1"></iframe>
</span></td>
</tr>
<tr>
<td class="style13" colspan="4"> </td>
</tr>
<tr>
<td class="style21" colspan="4">We envision ourselves to become
the key provider of ICT solutions, manpower supply & other
supplies and services to organizations locally and beyond.</td>
</tr>
<tr>
<td class="style15" colspan="4"> </td>
</tr>
<tr>
<td class="style15" colspan="4"> </td>
</tr>
<tr>
<td colspan="4"><span class="style13"><strong><br />
<span class="style23">Services</span><br />
</strong></span>
<br class="style7" />
</td>
</tr>
<tr>
<td style="width: 3889px" class="style7"><span class="style6"></span>
<img alt="network" height="103" src="images/network.png" style="position: relative; left: 12px; top: -3px;" width="102" /></td>
<td style="width: 4584px" class="style10"><span class="style17">Network</span><strong>
</strong></td>
<td style="width: 4035px" class="style7"><span class="style6"></span>
<img alt="manpower" height="107" src="images/manpower.png" style="position: relative; left: 22px; top: 1px;" width="105" /></td>
<td style="width: 4634px" class="style17">Manpower</td>
</tr>
<tr>
<td style="width: 3889px">
<img alt="software" height="105" src="images/software.png" style="position: relative; left: 66px; top: 2px;" width="103" /><br class="style7" />
</td>
<td style="width: 4584px" class="style18">Software</td>
<td style="width: 4035px" class="style7"><span class="style6"></span>
<img alt="safety" height="107" src="images/safety.png" style="position: relative; left: 24px; top: -2px;" width="104" /></td>
<td style="width: 4634px" class="style17">Safety</td>
</tr>
<tr>
<td style="width: 3889px">
<img alt="videoconference" height="101" src="images/video.png" style="position: relative; left: 67px; top: 3px;" width="102" /></td>
<td style="width: 4584px" class="style10"><span class="style17">Video Conferencing &
AV/</span><span class="style19">Solutions</span></td>
</tr>
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td colspan="4"><span class="style6"><strong>
<span class="style13"><br />
<span class="style23">News & Events</span><br />
</span>
</strong></span>
</td>
</tr>
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td style="width: 3889px">
<img alt="computer" height="83" src="images/Computer.png" style="position: relative; left: 79px; top: 3px;" width="83" /></td>
<td class="style9" colspan="3"><span class="style20">Supply &
Maintenance Computers for </span><strong><span class="style20">JX
Nippon Oil & Energy Corporation (Miri Branch)</span></strong></td>
</tr>
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td style="width: 3889px">
<img height="56" src="images/flircam.jpg" style="position: relative; left: 83px; top: 1px;" width="83" /></td>
<td colspan="3"><span class="style7"><span class="style17">Installing
FLIR camera at </span>
</span> <span class="style20"> <strong>PETRONAS Miri Crude Oil Terminal </strong></span>
<span class="style22">(Click <a href="project3page.html">here</a> to view)</span></td>
</tr>
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td style="width: 3889px">
<img height="83" src="images/cardaccess.png" style="position: relative; left: 82px; top: 0px;" width="83" /></td>
<td colspan="3"><span class="style20">Security Access Management System at </span>
<span class="style20"> <strong>
PETRONAS
FLNG Building </strong></span>
<span class="style22">(Click <a href="project2page.html">here</a> to view)</span></td>
</tr>
</table>
</span>
<br />
<br />
<span class="style6"></span>
</div>
<div id="page-bottom" style="left: 0px; top: 0px">
</div>
</div>
<div id="footer">
Copyright © 2016 <a href="index.html">www.mimars.com.my</a> All rights reserved.</div>
</body>
</html>
我有2个下拉菜单。当我点击第一个菜单时，它按预期打开。然后，当我点击第二个下拉列表时，第一个下拉列表将不会关闭。我该如何解决？我的剧本是问题吗？任何帮助，将不胜感激。谢谢。
答案 0 :(得分：0)
我改变的事情：
CloseAll()函数myFunction）<a href="javascript:void(0)" class="dropbtn" onclick="myFunction('myDropdown1')">Profile</a> function myFunction(target) {
var dropdown = document.getElementById(target);
var isOpen = dropdown.classList.contains('show')
closeAll();
if(!isOpen)
dropdown.classList.toggle("show");
}
function closeAll() {
var dropdowns = document.getElementsByClassName("dropdown-content");
for (var d = 0; d < dropdowns.length; d++) {
var openDropdown = dropdowns[d];
if (openDropdown.classList.contains('show')) {
openDropdown.classList.remove('show');
}
}
}
window.onclick = function(e) {
if (!e.target.matches('.dropbtn')) {
closeAll();
}
}
工作演示
* {
margin: 0;
padding: 0;
}
a {
text-decoration: underline;
color: #0F8C8C;
}
a:hover {
text-decoration: none;
}
body {
line-height: 1.75em;
background: url("../images/obg.png");
background-repeat:no-repeat;
background-size:cover;
background-attachment: fixed;
}
body,input {
font-family: "Times New Roman", Times, serif;
}
strong {
color: #000000;
}
br.clearfix {
clear: both;
}
h1,h2,h3,h4 {
font-weight: normal;
}
h2 {
font-size: 2.25em;
}
h2,h3,h4 {
color: #2C2B2B;
margin-bottom: 1em;
}
h3 {
font-size: 1.75em;
}
h4 {
font-size: 1.5em;
}
img.alignleft {
margin: 5px 20px 20px 0;
float: left;
}
img.aligntop {
margin: 5px 0 20px 0;
}
img.pic {
padding: 5px;
border: solid 1px #D4D4D4;
}
p {
margin-bottom: 1.5em;
}
ul {
margin-bottom: 1.5em;
}
ul h4 {
margin-bottom: 0.35em;
}
.box {
overflow: hidden;
margin-bottom: 1em;
}
.date {
background: #6E6E6E;
padding: 5px 6px 5px 6px;
margin: 0 6px 0 0;
color: #FFFFFF;
font-size: 0.8em;
border-radius: 2px;
}
#content {
width: 665px;
float: left;
padding: 0;
position: relative;
}
#content-box1 {
width: 320px;
float: left;
}
#content-box2 {
margin: 0 0 0 345px;
width: 320px;
}
#footer {
margin: 40px 0 120px 0;
text-align: center;
color: #000000;
}
#footer a {
color: #000000;
}
#header {
height: 75px;
position: relative;
padding: 45px;
color: #FFFFFF;
width: 888px;
overflow: hidden;
}
li.dropdown {
display: inline-block;
}
li a:hover, .dropdown:hover .dropbtn {
}
.dropdown-content {
background: url('../images/nav.png');
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
z-index: 1;
}
.dropdown-content a {
color: black;
text-decoration: none;
display: block;
text-align: center;
border: thin solid #000000;
}
.dropdown:hover .dropdown-content {
}
.show {display:block;}
#menu {
padding: 0 45px 0 45px;
position: relative;
background: url('../images/nav.png');
margin: 0 0 0 0;
height: 60px;
line-height: 60px;
width: 890px;
border-top: 1px solid #000000;
}
#menu a {
text-decoration: none;
color: #000000;
font-weight: bold;
font-size: large;
font-family: "Times New Roman", Times, serif;
}
#menu ul {
display: table;
width: 100%;
list-style: none;
margin: 0;
padding: 0;
}
#menu ul li {
display: table-cell;
background-position: 0 -118px;
background-repeat: no-repeat;
height: 49px;
width: 122px;
margin: 0;
padding-left: 1px;
text-align: center;
}
#menu ul li.first {
padding-left: 0;
}
#page {
background: url('../images/lgcont.jpg');
padding: 45px 45px 15px 45px;
position: relative;
width: 890px;
margin: 0;
}
#page .section-list {
list-style: none;
padding-left: 0;
}
#page .section-list li {
clear: both;
padding: 30px 0 30px 0;
}
#page ul {
list-style: none;
}
#page ul li {
border-top: solid 1px #D4D4D4;
padding: 15px 0 15px 0;
}
#page ul li.first {
padding-top: 0;
border-top: 0;
}
#page-bottom {
position: relative;
margin: 0;
background: #000000 url('../images/banner2.jpg') no-repeat left top;
width: 890px;
height: 200px;
padding: 45px 45px 0 45px;
color: #000000;
}
#page-bottom a {
color: #F5F5F5;
}
#page-bottom h2, #page-bottom h3, #page-bottom h4 {
color: #FFFFFF;
}
#page-bottom ul {
list-style: none;
}
#page-bottom ul li {
border-top: solid 1px #8F8F8F;
padding: 15px 0 15px 0;
}
#page-bottom ul li.first {
padding-top: 0;
border-top: 0;
}
#page-bottom-content {
width: 665px;
float: left;
clear: right;
}
#page-bottom-sidebar {
width: 200px;
margin: 0 0 0 0;
float: right;
}
#search input.form-submit {
margin-left: 1em;
color: #FFFFFF;
padding: 10px;
background: #2FACAC;
border: 0;
}
#search input.form-text {
border: solid 1px #8F8F8F;
padding: 10px;
}
#sidebar {
position: relative;
width: 200px;
padding: 0;
margin: 0 0 0 690px;
}
#splash {
background: url('../images/lgcont.jpg');
margin: 0 0 0 0;
height: 374px;
position: relative;
padding: 45px 45px 10px 45px;
width: 890px;
}
#splash .pic {
padding: 9px;
}
#wrapper {
background: url('../images/lgcont.jpg');
border: solid 1px #000000;
background-size:cover;
position: relative;
width: 980px;
margin: 75px auto 0 auto;
background: #FFFFFF;
}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mimars Energy Sdn Berhad - Your Best Partner in Business</title>
<link rel="icon" href="images/favImage.png" type="image/png"/>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<style type="text/css">
.style6 {
font-family: "Times New Roman", Times, serif;
}
.style7 {
text-align: center;
}
.style8 {
text-align: center;
font-size: xx-large;
}
.style9 {
text-align: left;
font-family: "Times New Roman", Times, serif;
}
.style10 {
text-align: left;
}
.style13 {
text-align: center;
font-family: "Times New Roman", Times, serif;
font-size: xx-large;
}
.style15 {
text-align: center;
font-family: "Times New Roman", Times, serif;
font-size: x-large;
}
.style17 {
font-size: large;
}
.style18 {
text-align: left;
font-size: large;
}
.style19 {
font-family: "Times New Roman", Times, serif;
font-size: large;
}
.style20 {
text-align: center;
font-size: large;
}
.style21 {
text-align: center;
font-family: "Times New Roman", Times, serif;
font-size: large;
}
.style22 {
text-align: center;
font-size: small;
}
.style23 {
font-size: x-large;
}
</style>
<script>
/* When the user clicks on the button,
toggle between hiding and showing the dropdown content */
function myFunction(target) {
var dropdown = document.getElementById(target);
var isOpen = dropdown.classList.contains('show')
closeAll();
if(!isOpen)
dropdown.classList.toggle("show");
}
function closeAll() {
var dropdowns = document.getElementsByClassName("dropdown-content");
for (var d = 0; d < dropdowns.length; d++) {
var openDropdown = dropdowns[d];
if (openDropdown.classList.contains('show')) {
openDropdown.classList.remove('show');
}
}
}
// Close the dropdown if the user clicks outside of it
window.onclick = function(e) {
if (!e.target.matches('.dropbtn')) {
closeAll();
}
}
</script>
</head>
<body>
<div id="wrapper">
<div id="header" style="background-image: url('images/logo.jpg'); width: 890px">
<img height="128" src="images/logo%20spin.gif" style="position: relative; left: 12px; top: -37px;" width="128" /></div>
<div id="menu">
<ul>
<li class="first current_page_item"><span class="style6"><a href="index.html">
Home</a></li>
<li class="dropdown"><a href="javascript:void(0)" class="dropbtn" onclick="myFunction('myDropdown1')">Profile</a>
<div class="dropdown-content" id="myDropdown1">
<a href="profile.html">Mission & Vision</a>
<a href="license.html">License</a>
</div>
</li>
<li><a href="project.html">Project</a></li>
<li><a href="suppliers.html">Suppliers</a></li>
<li class="dropdown"><a href="javascript:void(0)" class="dropbtn" onclick="myFunction('myDropdown2')">Partners</a>
<div class="dropdown-content" id="myDropdown2">
<a href="internationalpartners.html">International</a>
<a href="localpartners.html">Local</a>
</div>
</li>
<li class="last"><a href="contact.html">Contact Us</a></li>
</ul>
<br class="clearfix" />
</div>
<div id="page" style="left: 0px; top: 0px; height: 1549px;">
<table style="width: 100%">
<tr>
<td class="style13">
<strong>WELCOME TO MIMARS ENERGY</strong></td>
</tr>
</table>
<span class="style6"><br />
<table style="width: 100%">
<tr>
<td colspan="4" class="style7" style="height: 269px"><span class="style6">
<iframe src="slideshow.html" frameborder="0" style="border: thin solid #000000; width: 80%; height: 354px; left: 2px; top: -2px; overflow: hidden;" allowfullscreen id="I1" class="style8" name="I1"></iframe>
</span></td>
</tr>
<tr>
<td class="style13" colspan="4"> </td>
</tr>
<tr>
<td class="style21" colspan="4">We envision ourselves to become
the key provider of ICT solutions, manpower supply & other
supplies and services to organizations locally and beyond.</td>
</tr>
<tr>
<td class="style15" colspan="4"> </td>
</tr>
<tr>
<td class="style15" colspan="4"> </td>
</tr>
<tr>
<td colspan="4"><span class="style13"><strong><br />
<span class="style23">Services</span><br />
</strong></span>
<br class="style7" />
</td>
</tr>
<tr>
<td style="width: 3889px" class="style7"><span class="style6"></span>
<img alt="network" height="103" src="images/network.png" style="position: relative; left: 12px; top: -3px;" width="102" /></td>
<td style="width: 4584px" class="style10"><span class="style17">Network</span><strong>
</strong></td>
<td style="width: 4035px" class="style7"><span class="style6"></span>
<img alt="manpower" height="107" src="images/manpower.png" style="position: relative; left: 22px; top: 1px;" width="105" /></td>
<td style="width: 4634px" class="style17">Manpower</td>
</tr>
<tr>
<td style="width: 3889px">
<img alt="software" height="105" src="images/software.png" style="position: relative; left: 66px; top: 2px;" width="103" /><br class="style7" />
</td>
<td style="width: 4584px" class="style18">Software</td>
<td style="width: 4035px" class="style7"><span class="style6"></span>
<img alt="safety" height="107" src="images/safety.png" style="position: relative; left: 24px; top: -2px;" width="104" /></td>
<td style="width: 4634px" class="style17">Safety</td>
</tr>
<tr>
<td style="width: 3889px">
<img alt="videoconference" height="101" src="images/video.png" style="position: relative; left: 67px; top: 3px;" width="102" /></td>
<td style="width: 4584px" class="style10"><span class="style17">Video Conferencing &
AV/</span><span class="style19">Solutions</span></td>
</tr>
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td colspan="4"><span class="style6"><strong>
<span class="style13"><br />
<span class="style23">News & Events</span><br />
</span>
</strong></span>
</td>
</tr>
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td style="width: 3889px">
<img alt="computer" height="83" src="images/Computer.png" style="position: relative; left: 79px; top: 3px;" width="83" /></td>
<td class="style9" colspan="3"><span class="style20">Supply &
Maintenance Computers for </span><strong><span class="style20">JX
Nippon Oil & Energy Corporation (Miri Branch)</span></strong></td>
</tr>
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td style="width: 3889px">
<img height="56" src="images/flircam.jpg" style="position: relative; left: 83px; top: 1px;" width="83" /></td>
<td colspan="3"><span class="style7"><span class="style17">Installing
FLIR camera at </span>
</span> <span class="style20"> <strong>PETRONAS Miri Crude Oil Terminal </strong></span>
<span class="style22">(Click <a href="project3page.html">here</a> to view)</span></td>
</tr>
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td style="width: 3889px">
<img height="83" src="images/cardaccess.png" style="position: relative; left: 82px; top: 0px;" width="83" /></td>
<td colspan="3"><span class="style20">Security Access Management System at </span>
<span class="style20"> <strong>
PETRONAS
FLNG Building </strong></span>
<span class="style22">(Click <a href="project2page.html">here</a> to view)</span></td>
</tr>
</table>
</span>
<br />
<br />
<span class="style6"></span>
</div>
<div id="page-bottom" style="left: 0px; top: 0px">
</div>
</div>
<div id="footer">
Copyright © 2016 <a href="index.html">www.mimars.com.my</a> All rights reserved.</div>
</body>
</html>