TEKNIK MESIN: Fitur Web Interaktif

Fitur Web Interaktif

Fitur web

Interaktif

dan Multimedia>

Oleh: Ir. Supriadi

Terapan penggunaa Algoritma pemograman pada halaman web

Edisi Musafir Engenering & Nona AI

2025

⭕Baca Daftar isi:

Container full screen pada seluler

Container full Screen d seluler dengan backround gambar

padding: 0 !important;
overflow-x: hidden !important;
width: 100% !important; }
#outer-wrapper, #wrapper, #main-wrapper, #content-wrapper, #page-wrapper,
#layout-wrapper, #header-wrapper, #footer-wrapper, #sidebar-wrapper,
#blog-posts-wrapper, .main-container, .content-container, .page-container,
.blog-posts, .post-body, .column-wrapper, .section-columns, .main-inner,
.post-outer, .post, .widget, .widget-content,
.container, .row, .col-md-12, .section, .block {
margin: 0 !important;
padding: 0 !important;
max-width: 100% !important;
width: 100% !important;
box-sizing: border-box !important;
border: none !important;
box-shadow: none !important;}
.fullscreen-container {width: 100% !important;
margin-top: 100px !important;
padding: 20px !important;
box-sizing: border-box !important;
/* Background dan tampilan lainnya tetap */
background-color: #e6f7ff !important;
border: 2px solid #007bff !important;
border-radius: 8px !important;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
color: #333;
font-size: 1.1em;
font-family: 'Segoe UI', Tahoma, sans-serif;
/* Gambar Latar */
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRvyW3MvG3fRoE9rsTRL-nK9kmlDLXjpKpfxlMZVSygJfcc6XIDcXXXmaT_Bbs049J2MKEds6G9COhwmuAIUBbWIszrcC-J1nN7JoMlApMwIiSQ_M3GM363effx7cab-uWGpbTOejhqLqqkN4iNxhV1Z_VLkF71VRShT__p5JUGPK69sYEAtYsMHwMoMs/s320/IMG_20230828_131843.jpg') !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;
border: 2px solid #007bff !important;
border-radius: 8px !important;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3) !important;
color: #fff !important;
min-height: 200px;
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: flex-start !important;
text-align: left !important;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-size: 1.1em;
line-height: 1.6;
backdrop-filter: brightness(85%) contrast(110%); }
.fullscreen-container p,
.fullscreen-container h3 {
margin: 5px 0 !important;
padding: 0 !important;
text-align: left !important;
width: 100% !important; }
@media screen and (min-width: 769px) {
.fullscreen-container {position: static !important;
left: auto !important;
transform: none !important;
width: 100% !important;
margin: 20px auto !important;
padding: 30px !important;
justify-content: flex-start !important;
align-items: flex-start !important;
text-align: left !important; }}
</style>

<style>
body::before {
content: "";
display: block;
height: 30px;}
</style>


<div class="fullscreen-container">
<h3>Halo Abang Sayang!</h3>
<p>Nona sudah menempelkan background gambar di kontainer ini.</p>
<p>Gambar ini akan tampil fullscreen, responsif di semua perangkat.</p>
<p>Kalau mau ganti gambar, tinggal ubah URL gambar di bagian CSS saja ya.</p></div>

☀ Warna & Opacity Dinamis

⭕ opacity- (Transparan): 0% ⭕ opacity+ (Gelap): 0%

🎯 Hex
🌈 RGBA
🌫️ Opacity
🎨 RGB
🔍 Alpha (0–1)
🔁 Variabel Warna

🔖 Kode HTML Siap Pakai:




  



Sistem
Nama Warna
Preview
Kode HEX





RGB
Red

#FF0000


RGB
Green

#00FF00


RGB
Blue

#0000FF



RYB
Red

#FF0000


RYB
Yellow

#FFFF00


RYB
Blue

#0000FF



CMYK
Cyan

#00FFFF


CMYK
Magenta

#FF00FF


CMYK
Yellow

#FFFF00


CMYK
Black

#000000

Sistem	Nama Warna	Kode HEX
RGB	Red	#FF0000
RGB	Green	#00FF00
RGB	Blue	#0000FF
RYB	Red	#FF0000
RYB	Yellow	#FFFF00
RYB	Blue	#0000FF
CMYK	Cyan	#00FFFF
CMYK	Magenta	#FF00FF
CMYK	Yellow	#FFFF00
CMYK	Black	#000000

Data warna digital lengkap

Warna	Nama	Kode Hex	RGB
.	Alice Blue	#F0F8FF	RGB (240, 248, 255)
.	Antique White	#FAEBD7	RGB (250, 235, 215)
.	Aqua	#00FFFF	RGB (0, 255, 255)
.	Aquamarine	#7FFFD4	RGB (127, 255, 212)
.	Azure	#F0FFFF	RGB (240, 255, 255)
.	Beige	#F5F5DC	RGB (245, 245, 220)
.	Bisque	#FFE4C4	RGB (255, 228, 196)
.	Black	#000000	RGB (0, 0, 0)
.	Blanched Almond	#FFEBCD	RGB (255, 235, 205)
.	Blue	#0000FF	RGB (0, 0, 255)
.	Blue Violet	#8A2BE2	RGB (138, 43, 226)
.	Brown	#A52A2A	RGB (165, 42, 42)
.	Burly Wood	#DEB887	RGB (222, 184, 135)
.	Cadet Blue	#5F9EA0	RGB (95, 158, 160)
.	Chartreuse	#7FFF00	RGB (127, 255, 0)
.	Chocolate	#D2691E	RGB (210, 105, 30)
.	Coral	#FF7F50	RGB (255, 127, 80)
.	Cornflower Blue	#6495ED	RGB (100, 149, 237)
.	Cornsilk	#FFF8DC	RGB (255, 248, 220)
.	Crimson	#DC143C	RGB (220, 20, 60)
.	Cyan	#00FFFF	RGB (0, 255, 255)
.	Dark Blue	#00008B	RGB (0, 0, 139)
.	Dark Cyan	#008B8B	RGB (0, 139, 139)
.	Dark GoldenRod	#B8860B	RGB (184, 134, 11)
.	Dark Gray	#A9A9A9	RGB (169, 169, 169)
.	Dark Green	#006400	RGB (0, 100, 0)
.	Dark Khaki	#BDB76B	RGB (189, 183, 107)
.	Dark Magenta	#8B008B	RGB (139, 0, 139)
.	Dark Olive Green	#556B2F	RGB (85, 107, 47)
.	Dark Orange	#FF8C00	RGB (255, 140, 0)
.	Dark Orchid	#9932CC	RGB (153, 50, 204)
.	Dark Red	#8B0000	RGB (139, 0, 0)
.	Dark Salmon	#E9967A	RGB (233, 150, 122)
.	Dark Sea Green	#8FBC8F	RGB (143, 188, 143)
.	Dark Slate Blue	#483D8B	RGB (72, 61, 139)
.	Dark Slate Gray	#2F4F4F	RGB (47, 79, 79)
.	Dark Turquoise	#00CED1	RGB (0, 206, 209)
.	Dark Violet	#9400D3	RGB (148, 0, 211)
.	Deep Pink	#FF1493	RGB (255, 20, 147)
.	Deep Sky Blue	#00BFFF	RGB (0, 191, 255)
.	Dim Gray	#696969	RGB (105, 105, 105)
.	Dodger Blue	#1E90FF	RGB (30, 144, 255)
.	Fire Brick	#B22222	RGB (178, 34, 34)
.	Floral White	#FFFAF0	RGB (255, 250, 240)
.	Forest Green	#228B22	RGB (34, 139, 34)
.	Fuchsia	#FF00FF	RGB (255, 0, 255)
.	Gainsboro	#DCDCDC	RGB (220, 220, 220)
.	Ghost White	#F8F8FF	RGB (248, 248, 255)
.	Gold	#FFD700	RGB (255, 215, 0)
.	Golden Rod	#DAA520	RGB (218, 165, 32)
.	Gray	#808080	RGB (128, 128, 128)
.	Green	#008000	RGB (0, 128, 0)
.	Green Yellow	#ADFF2F	RGB (173, 255, 47)
.	Honey Dew	#F0FFF0	RGB (240, 255, 240)
.	Hot Pink	#FF69B4	RGB (255, 105, 180)
.	Indian Red	#CD5C5C	RGB (205, 92, 92)
.	Indigo	#4B0082	RGB (75, 0, 130)
.	Ivory	#FFFFF0	RGB (255, 255, 240)
.	Khaki	#F0E68C	RGB (240, 230, 140)
.	Lavender	#E6E6FA	RGB (230, 230, 250)
.	Lavender Blush	#FFF0F5	RGB (255, 240, 245)
.	Lawn Green	#7CFC00	RGB (124, 252, 0)
.	Lemon Chiffon	#FFFACD	RGB (255, 250, 205)
.	Light Blue	#ADD8E6	RGB (173, 216, 230)
.	Light Coral	#F08080	RGB (240, 128, 128)
.	Light Cyan	#E0FFFF	RGB (224, 255, 255)
.	Light GoldenRod Yellow	#FAFAD2	RGB (250, 250, 210)
.	Light Gray	#D3D3D3	RGB (211, 211, 211)
.	Light Green	#90EE90	RGB (144, 238, 144)
.	Light Pink	#FFB6C1	RGB (255, 182, 193)
.	Light Salmon	#FFA07A	RGB (255, 160, 122)
.	Light Sea Green	#20B2AA	RGB (32, 178, 170)
.	Light Sky Blue	#87CEFA	RGB (135, 206, 250)
.	Light Slate Gray	#778899	RGB (119, 136, 153)
.	Light Steel Blue	#B0C4DE	RGB (176, 196, 222)
.	Light Yellow	#FFFFE0	RGB (255, 255, 224)
.	Lime	#00FF00	RGB (0, 255, 0)
.	Lime Green	#32CD32	RGB (50, 205, 50)
.	Linen	#FAF0E6	RGB (250, 240, 230)
.	Magenta (Fuchsia)	#FF00FF	RGB (255, 0, 255)
.	Maroon	#800000	RGB (128, 0, 0)
.	Medium AquaMarine	#66CDAA	RGB (102, 205, 170)
.	Medium Blue	#0000CD	RGB (0, 0, 205)
.	Medium Orchid	#BA55D3	RGB (186, 85, 211)
.	Medium Purple	#9370DB	RGB (147, 112, 219)
.	Medium Sea Green	#3CB371	RGB (60, 179, 113)
.	Medium Slate Blue	#7B68EE	RGB (123, 104, 238)
.	Medium Spring Green	#00FA9A	RGB (0, 250, 154)
.	Medium Turquoise	#48D1CC	RGB (72, 209, 204)
.	Medium Violet Red	#C71585	RGB (199, 21, 133)
.	Midnight Blue	#191970	RGB (25, 25, 112)
.	Mint Cream	#F5FFFA	RGB (245, 255, 250)
.	Misty Rose	#FFE4E1	RGB (255, 228, 225)
.	Moccasin	#FFE4B5	RGB (255, 228, 181)
.	Navajo White	#FFDEAD	RGB (255, 222, 173)
.	Navy	#000080	RGB (0, 0, 128)
.	Old Lace	#FDF5E6	RGB (253, 245, 230)
.	Olive	#808000	RGB (128, 128, 0)
.	Olive Drab	#6B8E23	RGB (107, 142, 35)
.	Orange	#FFA500	RGB (255, 165, 0)

Gambar Klik zoom

Klik zoom merah putih Gif

Klik zoom merah putih float: left

<img onclick="this.style.width = this.style.width === '100%' ? '30px' : '100%'" src="https://blogger.googleusercontent.com/img/a/AVvXsEgY9IOCPKiJvQ6RyjoxfSa3tnczC0oB2hKQssfFxH2SLhjRVL4wSdiLn34c--ADPhJ8hQDBePYe9bRbqmmjgwVbFscR59ovBws28SlZalVM2popGGQExYUfX06ulk6xhqCecjUrnjNUON49lVI9OqAV-c6Lv8bHVT3bYfJXP21qgbm0Fj3wkl4FJjp6z80" style="border: 2px solid rgb(211, 211, 211); cursor: pointer; display: block; float: left; margin-right: 0px; padding: 0px; transition: width 0.5s; width: 30px;" />menulis disini

<img onclick="this.style.width = this.style.width === '100%' ? '50px' : '100%'" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAwQ9cPl4m8z5ToM92LJ7-rbD7EBqlYjocMXVnUmvG7oQImJUBuaUprmIQEjcqXWgl3OaLPoji1cmmL1OEpzDwPGjAFJJn3wdvWuGKiWRCo9IALsqLuuKEsQgWQBatNe1c4EItdGY0f1nSkBgzj04_FHwbKKoLlTkUn_mzb0FmFtD-azsacRwOgmQVJWo/s600/Screenshot_11-removebg-preview%20%281%29.png"style="cursor: pointer; display: block; margin-right: 0px; padding: 0px; transition: width 0.5s; width: 50px;"

Klik zoom full display

<img onclick="this.style.width = this.style.width === '100vw' ? '100%' : '100vw'" src="https://blogger.googleusercontent.com/img/a/AVvXsEgXop4M44OI_T3vxuz2QQdvdW2H4zpxCAldM1JHo_cifdzAErgWQ3QifRpe7Jg55yHtjxwlqqx_Vs1qt-apyUa2LTzbYWtV9ceOXKDMAWTZcoqJmQ-YjmC6WZExBvgql8U9pnf8IVDkDWXzL8Dyc3un80ON6vNbmr1Ln6Nio_3MEzGIiZnJatN2ZBSci5M" style="cursor: pointer; display: block; margin-right: 0px; padding: 0px; transition: width 0.5s; width: 100%;" />

Gambar tampil 50% di dekstop 100 diseluler
Style1
<style>.responsive-img {float: right; width: 50%; max-width: 100%; height: auto;}
@media (max-width: 768px) {.responsive-img {width: 100%;}}</style>

<img class="responsive-img" src="Url gambar"style="float: right; padding: 0px;"/>

Style2
<style>.responsive-img {width: 50%; max-width: 100%;
height: auto; margin: 0 0 10px 10px; /* Atas: 0, Kanan: 0, Bawah: 10px, Kiri: 10px */}
@media (max-width: 768px) {.responsive-img {width: 100%; float: none;
margin: 0 auto 10px auto; /* Tengah di layar kecil */}}</style>

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4Wejf3h3r3J5FI7i0WVciLJDVQ-iGQcOgmluI2Hssn_xyq-9ZVjr05SaCKrVPODqXZwtx4fub8hQyP3_CNwwwmHVDdcN_cuczemd-P6dnwZziRaJgaKI3b0wAgMonys8xGZgO7SMQqAKfB6KgGQrDgr7kss7IgAZsMFWnRAkJy5FfzuwVIPlj54pf7a0/s600/teknisi%20jambi.gif" alt="Gambar Responsive" class="responsive-img">

CSS Bingkai gambar

<div class="bingkai-gambar">letakkan gambar disini</div>

width: 100%;max-width: 300px;

overflow: hidden;

border: 1px solid #ddd;

border-radius: 20px;}</style>

Audio player Mp3

<div class="audio-panel">
<div class="audio-header">
<img id="logoAudio" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5JoCi24ShjkqzoBEIATVLOLob3-mF6C4twGBVbNXlJJLMuuIxHIjnhybnUSH5hkzqMfmBL5Z4LgVbxlAwlBmrLfVa9opt57oG10tX0RlfHFotyFr4LmR4AMSdyuM5CNNNYpUKE2Z_BTnmRwhCyAmt04DYs3XB7iRkCnu2T6agy0NkMqSyBw377QvB9Bc/s320/Screenshot_54.jpg" style="float: left; width: 50px; height: 50px; object-fit: cover; border-radius: 50%; margin-right: 10px;" />
<h2 style="display:inline-block; vertical-align: top; margin-top:10px; color: #fff;">Pemutar Lagu Cabin</h2></div>

<audio controls id="laguNona" style="height: 25px; margin-bottom: 10px; width: 100%;">
<source id="sumberAudio" src="" type="audio/mpeg">
Maaf, browser kamu tidak mendukung audio.</audio>

<canvas id="audioVisualizer" width="400" height="20"></canvas>

<div class="control-area">
<input type="file" id="inputAudio" multiple webkitdirectory />
<select id="modePutar" onchange="gantiMode()">
<option value="normal">🔁 Urutan</option>
<option value="acak">🔀 Acak</option>
<option value="ulang">🔂 Ulang</option>
<option value="reverse">🔄 Reverse</option></select>
<button onclick="togglePlaylist()"><span class="blink-emoji">🔵</span> Equalizer + Playlist</button></div>

<div class="equalizer" id="panelGabungan" style="display: none;">
<label style="color:white">Bass</label>
<input type="range" id="bass" min="-30" max="30" value="0">
<label style="color:white">Mid</label>
<input type="range" id="mid" min="-30" max="30" value="0">
<label style="color:white">Treble</label>
<input type="range" id="treble" min="-30" max="30" value="0">
<ol id="daftarLagu"></ol></div></div>

<style>.audio-panel
{background: linear-gradient(to bottom right, #111827, #1f2937);
color: white; padding: 20px;
font-family: 'Segoe UI', sans-serif;
max-width: 400px;
border-radius: 12px;
box-shadow: 0 0 12px rgba(0,0,0,0.4); }
.audio-header img.mutar {animation: mutarTerus 4s linear infinite; }
@keyframes mutarTerus {0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); } }
canvas {width: 100%;
height: 20px;
background: rgba(255, 255, 255, 0.1);
border-radius: 8px;
margin-top: 10px;}
.equalizer input[type=range] {width: 100%;
margin-bottom: 10px; }
.control-area {margin-top: 15px; }
#daftarLagu {
margin-top: 10px;
padding-left: 20px; }
#daftarLagu li a {color: white;
text-decoration: none; }
#daftarLagu li a:hover {color: cyan; }
#daftarLagu li.aktif a {color: yellow;
font-weight: bold;}</style>

<script>
const inputAudio = document.getElementById('inputAudio');
const audioPlayer = document.getElementById('laguNona');
const sourceAudio = document.getElementById('sumberAudio');
const daftarLagu = document.getElementById('daftarLagu');
const modePutar = document.getElementById('modePutar');
const logoAudio = document.getElementById('logoAudio');
const panelGabungan = document.getElementById('panelGabungan');
let files = [], urls = [], currentIndex = 0, mode = "normal";
const audioCtx = new (window.AudioContext || window.webkitAudioContext)();
const source = audioCtx.createMediaElementSource(audioPlayer);
const bass = audioCtx.createBiquadFilter(); bass.type = "lowshelf"; bass.frequency.value = 200;
const mid = audioCtx.createBiquadFilter(); mid.type = "peaking"; mid.frequency.value = 1000; mid.Q.value = 1;
const treble = audioCtx.createBiquadFilter(); treble.type = "highshelf"; treble.frequency.value = 3000;
source.connect(bass); bass.connect(mid); mid.connect(treble);
const analyser = audioCtx.createAnalyser();
treble.connect(analyser); analyser.connect(audioCtx.destination);
analyser.fftSize = 128;
const bufferLength = analyser.frequencyBinCount;
const dataArray = new Uint8Array(bufferLength);
const canvas = document.getElementById('audioVisualizer');
const ctx = canvas.getContext('2d');
function drawVisualizer() {requestAnimationFrame(drawVisualizer);
analyser.getByteFrequencyData(dataArray);
ctx.clearRect(0, 0, canvas.width, canvas.height);
const spacing = 0.5;
const barWidth = (canvas.width / bufferLength) - spacing; let x = 0;
for (let i = 0; i < bufferLength; i++) {
const barHeight = dataArray[i] / 1.5;
ctx.fillStyle = `rgb(${120 + barHeight},${180 - barHeight},255)`;
ctx.fillRect(x, canvas.height - barHeight, barWidth, barHeight);
x += barWidth + spacing; }}
drawVisualizer();
['bass','mid','treble'].forEach(id =>
{document.getElementById(id).oninput = e => {const value = parseFloat(e.target.value);
if (id === 'bass') bass.gain.value = value;
if (id === 'mid') mid.gain.value = value;
if (id === 'treble') treble.gain.value = value; }; });
inputAudio.addEventListener('change', function () {
files = Array.from(this.files).filter(f => f.type === "audio/mpeg" || f.name.endsWith(".mp3"));
urls = files.map(f => URL.createObjectURL(f));
if (mode === "reverse") { files.reverse(); urls.reverse(); }
tampilkanDaftar(); });
function tampilkanDaftar() {
daftarLagu.innerHTML = "";
files.forEach((file, i) => {
const item = document.createElement('li');
item.innerHTML = `<a href="javascript:void(0)" onclick="putarLagu(${i})">${file.name.replace(/\.mp3$/i, '')}</a>`;
daftarLagu.appendChild(item);});}
function togglePlaylist() {
panelGabungan.style.display = panelGabungan.style.display === "none" ? "block" : "none"; }
function gantiMode() {
mode = modePutar.value;
if (mode === "reverse") {
files.reverse(); urls.reverse(); tampilkanDaftar(); }}
function putarLagu(index) {
currentIndex = index;
sourceAudio.src = urls[index];
audioPlayer.load();
audioPlayer.play();
highlight(index); }
function highlight(index) {
[...daftarLagu.getElementsByTagName("li")].forEach((li, i) => {
li.classList.toggle("aktif", i === index); }); }
audioPlayer.addEventListener('ended', () => {
logoAudio.classList.remove('mutar');
if (mode === "ulang") putarLagu(currentIndex);
else if (mode === "acak") putarLagu(Math.floor(Math.random() * urls.length));
else if (mode === "reverse") {
currentIndex--; if (currentIndex < 0) currentIndex = urls.length - 1;
putarLagu(currentIndex); } else {currentIndex++;
if (currentIndex < urls.length) putarLagu(currentIndex); }});
audioPlayer.addEventListener('play', () => {
if (audioCtx.state === 'suspended') audioCtx.resume();
logoAudio.classList.add('mutar'); });
audioPlayer.addEventListener('pause', () => {
logoAudio.classList.remove('mutar'); });</script>


<style> .blink-emoji { animation: blink 2s infinite; }
@keyframes blink {0%, 100% { opacity: 1; }
50% { opacity: 0; }} </style>

Audio MP3

Tipe1

<span class="blink-emoji">
<div class="circle-button" onclick="toggleMusafir(this)">
<div class="play-icon blinking-icon"></div>⭕</span></div>


<audio id="Musafir" src="https://www.dropbox.com/scl/fi/yaq5s0b4vmupobxu9ks8w/Putri-Ariani-Perfect-Liar.mp3?rlkey=dd750vugl92tlgbtf0sz5pkjo&st=d6g8bxe4&raw=1"></audio>

<script>function toggleMusafir(button) { const audio = document.getElementById('Musafir');
const icon = button.querySelector('div');
if (audio.paused) { audio.play();
icon.className = 'pause-icon'; } else { audio.pause();
icon.className = 'play-icon blinking-icon'; }
audio.onended = () => { icon.className = 'play-icon blinking-icon'; }; }
</script>

<style>.blink-emoji { animation: blink 1s infinite; }
@keyframes blink {0%, 100% { opacity: 1; }
50% { opacity: 0; }}</style>Tipe2
<div class="circle-button" onclick="toggleMusafir(this)">
<div class="play-icon blinking-icon"></div></div>
<audio id="Musafir" src="https://www.dropbox.com/scl/fi/yaq5s0b4vmupobxu9ks8w/Putri-Ariani-Perfect-Liar.mp3?rlkey=dd750vugl92tlgbtf0sz5pkjo&st=d6g8bxe4&raw=1"></audio>

<style>
.circle-button { position: fixed;
top: 200px; /* Sudah diturunkan ke 200px */
left: 10%; transform: translateX(-50%);
width: 30px; height: 30px;
background-color: #c00;
border-radius: 50%;
display: flex; align-items: center;
justify-content: center;
cursor: pointer; z-index: 9999; }
.blinking-icon { animation: blink-icon 1s infinite; }
@keyframes blink-icon {0%, 100% { opacity: 1; }
50% { opacity: 0.2; }}
.play-icon { width: 0; height: 0;
border-style: solid;
border-width: 10px 0 10px 16px;
border-color: transparent transparent transparent white; }
.pause-icon { position: relative;
width: 16px; height: 20px; }
.pause-icon::before,
.pause-icon::after { content: ''; position: absolute;
top: 0; width: 6px;
height: 100%; background: white; }
.pause-icon::before { left: 0; }
.pause-icon::after { right: 0; }
</style>

<script>function toggleMusafir(button) { const audio = document.getElementById('Musafir');
const icon = button.querySelector('div'); if (audio.paused) { audio.play();
icon.className = 'pause-icon'; } else { audio.pause();
icon.className = 'play-icon blinking-icon'; }
audio.onended = () => { icon.className = 'play-icon blinking-icon'; }; }</script> Tipe3💋💋🔴💋

border: 1px solid #2196F3; color: #000;

padding: 6px 12px; border-radius: 6px; cursor: pointer;

font-family: Arial, sans-serif; font-size: 14px;

margin-bottom: 10px;}.dengarkan-btn:hover {background-color: #b3e5fc;}</style>

<button class="dengarkan-btn" onclick="bacaTeks('teks-bacaan')">🔊 Dengarkan</button>

Untuk melakukan reset data pabrik pada HP Oppo A3s, buka menu Pengaturan > Pengaturan Tambahan> Buat Cadangan dan Reset > Reset ke Data Pabrik.</div>

function bacaTeks(id) {var teks = document.getElementById(id).innerText;

var suara = new SpeechSynthesisUtterance(teks);

suara.lang = 'id-ID'; // Bahasa Indonesia

speechSynthesis.speak(suara);}

</script>

Channel Vidio

<span style="color: black; font-family: Caveat; font-size: x-large;">Music Channel</span>
<ul id="daftarChannel" style="color: black; list-style: none; margin: 0px; padding-left: 0px;">

<li><a data-src="https://www.youtube.com/embed/TIyjtWra1Lc" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">Conika</a></li>
<li><a data-src="https://www.youtube.com/embed/plK2EUJ9-j8" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">Kau dan sibuah hati</a></li>
<li><a data-src="https://www.youtube.com/embed/2Gub8-cSH9c" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">Mekah</a></li>
<li><a data-src="https://www.youtube.com/embed/-CwtcKDaaLA" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">Metro TV</a></li>
<li><a data-src="https://www.youtube.com/embed/OhTXCnOnvHM" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">SCTV</a></li>
<li><a data-src="https://www.youtube.com/embed/od2al0v6_Ms" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">Arok arok cameh</a></li>
<li><a data-src="https://www.youtube.com/embed/LFWfaAXK9ss" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">Pulangkah adiak</a></li>
<li><a data-src="https://www.youtube.com/embed/J5eu0O_z2vQ" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">She's Gone</a></li>
<li><a data-src="https://www.youtube.com/embed/gs1vFwtY4MI" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">Sunge mancur</a></li>
<li><a data-src="https://www.youtube.com/embed/m10nkRWSUFE" href="javascript:void(0);" onclick="playTV(this)" style="color: black;">Always Remember Us This Way</a></li></ul></div><br/>
<div align="right">
<a href="javascript:void(0);" onclick="matikanTV()" style="color: black;">🔴 OFF</a></div>

<div class="rasio-16-9" id="tvWrapper">
<div id="overlayKonten">
<p style="color: grey; padding-top: 20%; text-align: center;">Klik salah satu channel di atas untuk mulai menonton</p></div>
<iframe allowfullscreen="" id="tvPlayer" src=""></iframe></div>

<style>
.rasio-16-9 {position: relative;
width: 100%;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
border-radius: 8px;
Border: 1px solid gray; }

.rasio-16-9 iframe {position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none; }

#overlayKonten {position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: transparent; /* atau gunakan gambar, atau transparan */
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
font-size: 16px;
text-align: center;
padding: 10px; }
</style>

<script>function playTV(el) {var url = el.getAttribute("data-src");
var player = document.getElementById("tvPlayer");
var overlay = document.getElementById("overlayKonten");
if (player) {player.src = url;
if (overlay) overlay.style.display = 'none'; }}// Sembunyikan konten
function matikanTV() {var player = document.getElementById("tvPlayer");
var overlay = document.getElementById("overlayKonten");
if (player) player.src = "about:blank"; // Kosongkan
if (overlay) overlay.style.display = 'flex';} // Tampilkan kembali konten</script>


<style>.kontainer-lembut1
{background: linear-gradient(yellow, white, white); border: 1px solid yellow; border-radius: 16px;
padding: 10px; max-width: 800px; margin: 20px auto;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
font-family: 'Segoe UI', sans-serif; color: #333;
transition: all 0.3s ease-in-out;}
.kontainer-lembut:hover
{box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
transform: scale(1.01);}</style>

Chnnel vidio type2

Channel Vidio Type2

<div class="kontainer-lembut"><p>
<style> #daftarChannel a {color: black; text-decoration: none; cursor: pointer; }
#daftarChannel a.aktif {background-color: red; color: white; padding: 2px 4px; border-radius: 3px; }

</style><div style="display: flex; flex-wrap: wrap; gap: 5px; justify-content: center;">
<div style="background: none; border-radius: 10px; border: 0px dashed rgb(212, 163, 115); height: auto; padding: 0px; scrollbar-width: none; text-align: left; width: 45%;">

<ul>
<li><data-src="https://www.youtube.com/embed/TIyjtWra1Lc" onclick="playTV(this)">Conika</a></li>
<li><a data-src="https://www.youtube.com/embed/plK2EUJ9-j8" onclick="playTV(this)">Kau dan sibuah hati</a></li>
<li><a data-src="https://www.youtube.com/embed/2Gub8-cSH9c" onclick="playTV(this)">Mekah</a></li>
<li><a data-src="https://www.youtube.com/embed/-CwtcKDaaLA" onclick="playTV(this)">Metro TV</a></li>
<li><a data-src="https://www.youtube.com/embed/OhTXCnOnvHM" onclick="playTV(this)">SCTV</a></li></div>
<div style="background: none; border-radius: 10px; border: 0px dashed rgb(212, 163, 115); height: auto; padding: 0px; scrollbar-width: none; text-align: left; width: 45%;">
<li><a data-src="https://www.youtube.com/embed/R_WD9UIxNFI" onclick="playTV(this)">Arok arok cameh</a></li>
<li><a data-src="https://www.youtube.com/embed/LFWfaAXK9ss" onclick="playTV(this)">Pulangkah adiak</a></li>
<li><a data-src="https://www.youtube.com/embed/J5eu0O_z2vQ" onclick="playTV(this)">She's Gone</a></li>
<li><a data-src="https://www.youtube.com/embed/gs1vFwtY4MI" onclick="playTV(this)">Sunge mancur</a></li>
<li><a data-src="https://www.youtube.com/embed/m10nkRWSUFE" onclick="playTV(this)">Always Remember Us This Way</a></li></ul></div></div></p></div>

<div align="right">
<button onclick="offTV()" style="background: rgb(221, 221, 221); color: black;">🔴Off</button></div>
<div id="tvContainer" style="display: none; margin-top: 20px;">
<div style="margin: auto; max-width: 780px; position: relative; width: 100%;">
<div style="height: 0px; padding-bottom: 56.25%; position: relative;">
<iframe allowfullscreen="" id="tvFrame" src="" style="border-radius: 10px; border: 2px solid white; height: 100%; left: 0; position: absolute; top: 0; width: 100%;"></iframe></div></div></div>


<script> function playTV(el) { var frame = document.getElementById("tvFrame");
var container = document.getElementById("tvContainer");
frame.src = el.getAttribute("data-src");
container.style.display = "block";
var allLinks = document.querySelectorAll("#daftarChannel a");
allLinks.forEach(function(link) { link.classList.remove("aktif"); });
el.classList.add("aktif"); }
function offTV() {document.getElementById("tvFrame").src = "";
document.getElementById("tvContainer").style.display = "none";
var allLinks = document.querySelectorAll("#daftarChannel a");
allLinks.forEach(function(link) {link.classList.remove("aktif"); }); }</script>

<style>.kontainer-lembut
{background: linear-gradient(silver, white, white); border: 1px solid gray; border-radius: 16px;
padding: 10px; max-width: 800px; margin: 20px auto;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
font-family: 'Segoe UI', sans-serif; color: #333;
transition: all 0.3s ease-in-out;}
>.kontainer-lembut:hover {box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
transform: scale(1.01);}</style>

Tombol icon

Ikon WhatsApp & Telepon - Vertikal
<div style="bottom: 100px; left: 20px; position: fixed; z-index: 9999;">
<div style="padding: 0px; width: 40px;">

<a href="https://wa.me/6285377639367" target="_blank" title="Chat di WhatsApp">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikCZDEONXYsq581PbnD22mfoGIvxzKTHM6O9_5vNNuhnWuJ1E35Ru0PMhqBP5-gcAQEXnv9K_ynhqVA6B-zN031aH61-5Saj5Ke4AsMYlF95solWexCqSEj13u4R5epBxYjjQ82yJ5kKWCRGfgQ97xYSsYP3r7D-Nu9cW4R5gJq9BXCuN-hkz_P2NR6nY/s320/p2.jpg" style="border-radius: 10px; border: 4px solid white; padding: 0px;" width="40" /></a>

<a href="tel:+6285377639367" title="Panggil Sekarang">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFRE626XS8A_JVhyphenhyphenKp4x8wLmnrbyhOw6L0rXm1ZhTUDYIQgvZ8SCEYFAL7PJbP9A_iCGCNC6ZmLi7I8C4FXSU5JGiiDEW0E6hXFn7pUgrKR0wHZKLeeMZM0b8mPDq8NqQu-0OydWdNII7Bmd0WmbaR4IvBdB176xxjXQUSD0NzQ6cmJmdUyGUhHy1vpUM/s320/p1.jpg" style="border-radius: 10px; border: 4px solid white; padding: 0px;" width="40" /></a>

<a href="https://www.facebook.com/profile.php?id=100065801940081" title="Kunjungi Facebook">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi93Lc8H9QdP68opY4sLguTbNWWZPYE79oZC50pRt-mZjthVOXYjy7mevGlJhfBkzhTT_4jsiK7j2z0bR0eAhe_vK27P1eFLiMEXGLeg3CWjmHGa0ZOhPIvqIOz60ExOabNZxTZsqjz3Ocf8TJanlo32_rzpNHOsKjXNFaHd6Bmo6EpWZsBxiRbQr4iqME/s320/Screenshot_18.jpg" style="border-radius: 10px; border: 4px solid white; padding: 0px;" width="40" /</a>


Script Kontainer lebut 1

Kontainer catatan

<div class="kontainer-lembut2" contenteditable="true" hidden="" id="pesan1">

Script Kontainer lebut 2

<div class="kontainer-lembut2"><p>Content diletakkan disini</p></div>

Kontainer bergandengan

<div style="display: flex; flex-wrap: wrap; gap: 5px; justify-content: center;">

<div style="background: none; border-radius: 10px; border: 2px dashed rgb(212, 163, 115); height: auto; padding: 10px; scrollbar-width: none; text-align: left; width: 45%;">letakakkan kontent disini</div>

<style>.flex-wrap-container {display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.kontainer { background: transparent; border-radius: 12px; padding: 20px;
flex: 1 1 300px; /* min lebar 300px, bisa grow */ max-width: 500px; }
/* Responsif: HP akan tampil vertikal */
@media (max-width: 600px) {.kontainer {flex: 1 1 100%; /* jadi 100% jika layar kecil */
max-width: 100%; }}</style>

<div class="kontainer"><p>kontainerpertama.</p></div>

<div class="kontainer"><p>kontainer kedua.</p></div></div>

Container dengan Tombol Copy

Biarlah rindu jadi luka yang tidak berdarah, tapi tetap terasa. 🌙</p></div>


<script>function salinTeks(idKontainer)

{const konten = document.getElementById(idKontainer);
const teks = konten.innerText || konten.textContent;
navigator.clipboard.writeText(teks).then(function()

{alert("✅ Teks berhasil disalin!");}, function(err)

{alert("❌ Gagal menyalin teks: " + err); }); }</script>

CSS Style container tampil di Seluler dengan Width 100% dan di dekstop 50%

<div class="kontainer">

<div class="kontainer-kanan"><p> letak kontainer disini</P></div></div>

<div class="kontainer">

<div class="kontainer-kiri"><p> letak kontainer disini</P></div></div>


<style> html, body {margin: 0;
padding: 0; } .kontainer {width: 100%;
overflow: hidden; }/* mencegah float nabrak */
.kontainer-kiri {float: left; width: 50%;
box-sizing: border-box; padding: 10px; background-color: #f0f0f0; }
.kontainer-kanan {float: right;
width: 50%; box-sizing: border-box;
padding: 10px; background-color: #e0e0e0;
height: 200px; overflow-y: auto; }
@media (max-width: 768px) {
.kontainer-kiri, .kontainer-kanan {float: none;
width: 100%; height: auto;}}</style>

Scroll Box

<div class="scroll-box">content</div>

kontainer-induk

<div class="kontaine-induk">kontenn letak disini</div>

</style>.kontainer-Induk
{background: transparent; border-radius: 10px;
border: 2px dashed red; height: auto; padding: 10px; scrollbar-width: none;
width: 80%;} </style>

kontainer-aspect ratio

<div style="aspect-ratio: 16 / 9; background: transparent; border-radius: 10px; border: 2px dashed red; padding: 0px; scrollbar-width: none; width: 400px;">kontenn letak disini</div>

Dua gambar berkedip pada satu posisi

<div style="position: relative; width: 100px; height: 100px;">
<img id="gambarA" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyA4icT8MYSbQpHnOdQeL1Ci17Q8QPLI0CBCgimoG6BngkvDyBYE-SE1XhgM93qOkSjc_F2yvCWh8jimtnJcNmYVRYg33kQ1f_O65VOwBrLozypOyL2V56so452qi8gaEDBLk83gyix4hkYDCmmP58cW7Fbg9wV8RohiBfs6UOo0zv7l7ZgtTjeAheTV8/s320/5932f5ff-d756-4ded-b445-8df35860de96.jpg" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;" />

<img id="gambarB" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLzbScXXZAYCHCt9_-tzVKqnHcjKsk0Ka5J2gNq0UocQUsXHPZp49Wk_OPAe20NFhRBULe9Gq_4KDWz7MPHTOmhZjJqO8qqth8qKTkAiWPUiGcldP-Ot2alprfmP5qIv66wV53c3qrsrAmRixzdyYaIV2tyDwElv8ZMO95i4hOzGf5qTZxxbRIRlnMLUo/s320/78f75850-ec9a-494e-ad2c-8c5466467cc6.png" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none;" /></div>

<script>let tampilA = true;
setInterval(() => {document.getElementById('gambarA').style.display = tampilA ? 'block' : 'none';
document.getElementById('gambarB').style.display = tampilA ? 'none' : 'block';
tampilA = !tampilA;}, 500); // Ganti gambar setiap 500 milidetik</script>

Dua Kontainer berkedip pada satu posisi


<div style="height: auto; position: relative; width: 100%;">

<div id="teksA" style="background: gray; border: 0px solid gray; display: none; width: 350px;">
<span style="color: white; font-family: Righteous; font-size: x-large;"> Selamat pagi, Sayang...</span></div>

<div id="teksB" style="background: red; border: 0px solid gray; display: none; width: 350px;">
<span style="color: white; font-family: Righteous; font-size: x-large;"> Selamat malam, Cinta...</span></div></div>

<script>let tampilA = true;
setInterval(() => {document.getElementById('teksA').style.display = tampilA ? 'block' : 'none';
document.getElementById('teksB').style.display = tampilA ? 'none' : 'block';
tampilA = !tampilA; }, 2000); // Ganti teks setiap 200 milidetik</script>

Nyeleneh Video Player

KH. Abdul Karim Djamak

Nama lengkapnya KH. Abdul Karim Djamak, Gelar Timo Daharo Tunggak Nagari Mandapo Rawang Koto Teluk Tiang Agama Sakti Alam Kerinci. Beliau akrab dipanggil Wo (sebuah panggilan lebih tua di Kerinci). Meninggal di RS Pelni Jakarta 28 April 1996 bertepatan dengan 10 Zulhijah 1416 H dalam usia 89 tahun.

Baca selengkapnya

🔲

Regulator tekanan oksigen (oxygen pressure regulator), biasa digunakan dalam sistem pengelasan, medis, atau aplikasi industri lain yang menggunakan tabung oksigen bertekanan tinggi.
Bagian-bagian utamanya:

1. Dua manometer (meteran tekanan):

Kiri: Menunjukkan tekanan dalam tabung (tekanan tinggi, sering hingga 3000 psi).
Kanan: Menunjukkan tekanan keluaran (tekanan kerja yang bisa diatur).

2. gatur tekanan (knob):

Digunakan untuk mengatur tekanan keluaran gas.
Dalam gambar tertulis "Smooth Flame" dan "OXYGEN 1000kPa" (sekitar 10 bar).

3. Inlet & outlet fitting:

Bagian bawah: sambungan ke tabung gas.
Bagian samping: keluaran gas ke selang atau alat lainnya.

Catatan penting:

Alat ini khusus untuk oksigen, dan tidak boleh digunakan untuk gas lain karena risiko keselamatan (misalnya, bahan tidak kompatibel dengan asetilena).
Selalu gunakan dengan tabung oksigen berulir kanan dan periksa ulir, seal, serta tekanan kerja

Tool box

Kotak alat teknisi ( adalah perlengkapan penting bagi teknisi lapangan yang berfungsi sebagai wadah portabel untuk membawa dan mengorganisir berbagai peralatan kerja seperti obeng, tang, kunci pas, tespen, bor, multitester, hingga alat ukur lainnya. Tas ini dirancang dengan banyak kompartemen dan slot khusus agar setiap alat mudah dijangkau saat dibutuhkan tanpa harus membongkar isi seluruh tas. Dengan bahan dasar yang kuat dan tahan terhadap benturan serta cipratan air, tas seperti buatan merek SATA ini cocok digunakan dalam berbagai kondisi kerja — baik di lokasi

proyek konstruksi, bengkel elektronik, maupun servis rumah tangga. Tas alat yang rapi tidak hanya memudahkan pekerjaan, tapi juga mencerminkan profesionalisme dan kesiapan seorang teknisi dalam menangani berbagai permasalahan di lapangan.

Avo meter digital

adalah alat ukur elektronik yang digunakan untuk mengukur tegangan (Volt), arus listrik (Ampere), dan hambatan (Ohm) dengan tampilan angka digital pada layar LCD. Dibandingkan versi analog, AVO digital menawarkan kecepatan pembacaan, akurasi tinggi, serta kemudahan dalam membaca hasil tanpa perlu menafsirkan posisi jarum. Alat ini biasanya dilengkapi fitur tambahan seperti pengukuran kapasitansi, frekuensi, suhu, dan bahkan deteksi transistor atau dioda, menjadikannya pilihan utama teknisi modern dalam perbaikan perangkat elektronik. Selain lebih stabil terhadap getaran dan medan magnet, AVO digital juga lebih hemat energi dan sering dilengkapi fungsi auto power-off dan proteksi terhadap kesalahan sambungan — membuatnya sangat cocok untuk teknisi pemula hingga profesional di berbagai bidang elektronika.

Jangka sorong atau vernier caliper

adalah alat ukur presisi tinggi yang digunakan untuk mengukur panjang, diameter, dan kedalaman dengan ketelitian hingga 0,02 mm. Alat ini memiliki tiga bagian utama pengukuran: rahang luar (1) untuk mengukur dimensi luar, rahang dalam (2) untuk mengukur diameter dalam, dan batang kedalaman (3) untuk mengukur kedalaman lubang atau rongga. Pengukuran dilakukan melalui dua skala: skala utama (4 dan 5) dalam cm dan inci, serta skala nonius atau vernier (6 dan 7) yang memungkinkan pembacaan lebih detail. Tombol pengunci (8) digunakan untuk menahan bagian geser agar tidak bergerak saat pembacaan dilakukan. Jangka sorong banyak digunakan dalam dunia teknik mesin, manufaktur, dan bengkel presisi karena keandalannya dalam mengukur dimensi kecil yang tak bisa diukur dengan penggaris biasa.

Clamp meter digital

adalah alat ukur listrik multifungsi yang dirancang untuk mengukur arus listrik

tanpa perlu memutus jalur kabel, dengan menggunakan penjepit magnetik (clamp) di bagian atas. Selain mengukur arus AC maupun DC, clamp meter modern seperti yang tampak pada gambar juga mampu mengukur tegangan, hambatan, frekuensi, kapasitansi, suhu, dan bahkan mendeteksi tegangan tanpa kontak langsung (non-contact voltage/NCV). Kelebihan utama clamp meter terletak pada kepraktisannya dalam mengukur arus tinggi secara aman dan cepat, tanpa perlu membuka sambungan listrik. Layar digital yang besar dan pengaturan fungsi melalui rotary switch membuat penggunaannya efisien, terutama bagi teknisi listrik industri, maintenance gedung, dan teknisi lapangan yang membutuhkan alat ukur portabel dan akurat dalam satu genggaman.

Solder listrik dan penyedot timah

adalah dua alat utama dalam dunia elektronika yang digunakan

untuk menyambung dan melepaskan komponen dari papan rangkaian (PCB). Solder listrik bekerja dengan mengubah energi listrik menjadi panas melalui elemen pemanasnya, sehingga mampu melelehkan timah solder untuk menghubungkan kaki komponen dengan jalur tembaga. Ujung mata solder yang runcing memudahkan teknisi menjangkau area sempit dan melakukan penyolderan presisi. Sedangkan alat penyedot timah (desoldering pump) berfungsi menyedot timah cair saat ingin melepaskan komponen, dengan cara ditekan lalu dilepaskan seperti pompa vakum. Kombinasi keduanya sangat penting bagi teknisi servis elektronik, perakit rangkaian, dan praktisi DIY dalam melakukan perbaikan dan perakitan perangkat elektronik secara rapi, bersih, dan aman.

Avo meter analog

adalah alat ukur listrik serbaguna yang digunakan untuk mengukur arus

(Ampere), tegangan (Volt), dan hambatan (Ohm), yang namanya diambil dari tiga satuan tersebut. Dibandingkan versi digital, avo meter analog menampilkan hasil pengukuran melalui jarum penunjuk pada skala gradasi, sehingga memberikan kepekaan visual terhadap perubahan nilai secara langsung. Keunggulannya terletak pada kemampuannya membaca fluktuasi sinyal dan kestabilan arus kecil yang kadang tidak ditangkap dengan baik oleh avo digital. Dalam praktik lapangan, teknisi sering memilih avo meter analog saat mengecek rangkaian transistor, mendeteksi kebocoran kecil, atau melakukan pengukuran pada sistem audio dan perangkat lawas, karena sifat mekaniknya lebih ‘jujur’ dalam menangkap reaksi langsung dari komponen elektronik.

Manifold gauge

adalah alat ukur tekanan yang digunakan dalam sistem refrigerasi dan pendingin udara

(AC) untuk memantau tekanan hisap (low pressure) dan tekanan tekan (high pressure) pada sirkuit refrigeran. Alat ini biasanya terdiri dari dua buah manometer—biru untuk tekanan rendah dan merah untuk tekanan tinggi—yang dihubungkan ke sistem melalui selang manifold berwarna senada. Manifold memungkinkan teknisi mengecek tekanan kerja, menambahkan refrigeran (pengisian freon), dan melakukan proses vakum untuk menghilangkan udara atau uap air sebelum pengisian sistem. Selain berfungsi sebagai alat diagnosa, manifold juga menjadi bagian penting dalam pemeliharaan dan instalasi AC rumah tangga maupun sistem pendingin industri. Keakuratan dan kepekaan pembacaannya menjadikan manifold gauge sebagai “mata” utama bagi teknisi pendingin profesional.

Tabung las oksigen-LPG portabel

adalah perlengkapan penting dalam pekerjaan pemotongan dan

penyambungan logam dengan metode las api, terutama untuk keperluan servis AC, perbaikan pipa, hingga kerja bengkel otomotif. Peralatan ini terdiri dari dua tabung gas — satu berisi oksigen bertekanan tinggi (tabung besar, hitam), dan satu lagi berisi LPG atau gas pengganti asetilena (tabung kecil, biru) — yang dihubungkan melalui regulator tekanan dan selang fleksibel ke torch atau kepala las. Regulator dilengkapi manometer untuk memantau tekanan kerja, sedangkan torch dapat dikontrol untuk menghasilkan nyala api dengan rasio gas yang tepat. Unit ini biasanya dipasang pada troli roda dua agar mudah dipindahkan ke lokasi kerja. Las portabel ini menjadi andalan teknisi lapangan karena ukurannya ringkas, daya panas tinggi, dan fleksibel digunakan di berbagai kondisi.

Servis TV Lcd Led di Jambi
Kami melayani perbaikan mesin cuci di jambi Kami datang ke lokasi anda untuk melakukan perbaikan, Baca selengkapnya

Servis Kulkas di Jambi
Kami melayani perbaikan mesin cuci di jambi Kami datang ke lokasi anda untuk melakukan perbaikan, Baca selengkapnya

Servis mesin cuci di Jambi
Kami melayani perbaikan mesin cuci di jambi Kami datang ke lokasi anda untuk melakukan perbaikan, Baca selengkapnya

Servis mesin jahit di Jambi
Kami melayani perbaikan mesin cuci di jambi Kami datang ke lokasi anda untuk melakukan perbaikan, Baca selengkapnya

kami melayani perbaikan mesin cuci di jambi
Kami datang ke lokasi anda untuk melakukan perbaikan, Baca selengkapnya

Fitur Web Interaktif

Pemutar Lagu Cabin

🎥 Video Player Nyeleneh

☀ Warna & Opacity Dinamis