Agoes' Blog http://agoesdoubleb.i-bego.com Selamat datang di Blogku, mari belajar belajar dan belajar....... huehehehe........ Fri, 16 Jul 2010 04:42:02 +0000 http://wordpress.org/?v=2.8.5 en hourly 1 Content Slider jQuery Plugins… http://agoesdoubleb.i-bego.com/?p=293 http://agoesdoubleb.i-bego.com/?p=293#comments Fri, 16 Jul 2010 04:36:06 +0000 admin http://agoesdoubleb.i-bego.com/?p=293 Assalamualaikum Wr Wb..

Lama tidak melakukan Update pada Blog ini… ;-)

Hari ini sya ingin berbagi tentang jQuery… kebetulan kemarin habis selesai mengerjakan PANIC (Papan Informasi Digital Inovation Centre STMIK Amikom)

Untuk sementara belum bisa dilihat secara online, mungkin nanti. hiks ;-)

Seperti ini previewnya…

Inti dari hal yang ingin kita bicarakan disini bukan disitu… tapi pada jQuery plugin yang saya gunakan untuk membuat efek slider pada list Job Karyawan….

Untuk yang ingin melihat DEMOnya disini

http://agoesdoubleb.i-bego.com/arsip/agoes-slider/index.html

Untuk script jQuery seperti ini aslider.js http://agoesdoubleb.i-bego.com/arsip/agoes-slider/aslider.js

Untuk Contoh penggunaan seperti ini.

<script>
$(function(){
$(”#cslider”).aslider();
});
</script>

Untuk File Downloadnya disini http://agoesdoubleb.i-bego.com/arsip/agoes-slider/agoes-slider.zip ;-)

Kalau ada yang ingin ditanyakan silahkan comment saja… :D

Wassalamualaikum wr wb… ;-)

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=293 4 Patch bug fancybox jquery plugin http://agoesdoubleb.i-bego.com/?p=290 http://agoesdoubleb.i-bego.com/?p=290#comments Sun, 27 Jun 2010 15:05:38 +0000 admin http://agoesdoubleb.i-bego.com/?p=290 Assalamualaikum wr wb…

Sedikit ingin berbagi tentang jQuery….

Jadi disini saya menggunakan salah satu plugin jquery fancybox Plugin ini berfungsi untuk memberikan efek full preview pada image…

Ketika image di klik maka gambar secara penuh akan ditampilkan dalam bentuk animasi… (Bisa dicoba sendiri demonya ;-) )

Nah, ketika saya terapkan pada website, ternyata terdapat sedikit kekurangan…  Seperti ini screenshootnya…

Embed flash di header menutupi layer fancybox… Pasti hal ini akan sangat mengganggu kan… :D

Ok, bagaimana kalau kita coba untuk melakukan sedikit perubahan pada script javascript fancybox untuk mengatasi masalah ini… Sebelumnya teman2 bisa mendownload fancybox pada  link ini download

Buka file jquery.fancybox-1.3.1.js hal yang akan kita lakukan adalah merubah style display tag <object> menjadi none ketika fancybox difungsikan dan mengembalikan ke aslinya ketika action close dijalankan…

perubahan pertama, pada line 356

fancybox_show = function() {
loading.hide();
$(”object”).css(”display”,”none”);
if (wrap.is(”:visible”) && $.isFunction(currentOpts.onCleanup)) {
if (currentOpts.onCleanup(currentArray, currentIndex, currentOpts) === false) {
$.event.trigger(’fancybox-cancel’);
busy = false;
return; } }

Tambahkan kode :

$(”object”).css(”display”,”none”);

Kode ini berfungsi untuk merubah style display tag <object> menjadi none, sehingga embed flash tidak akan menutupi layer fancybox.

Perubahan kedua, line 909 pada function close

$.fancybox.close = function() {
$(”object”).css(”display”,”block”);
if (busy || wrap.is(’:hidden’)) {
return;
}

Tambahkan kode :
$(”object”).css(”display”,”block”);
Kode ini berfungsi untuk mengembalikan style <object> ke bentuk awal.

Ok Beres :D Silahkan save file dan saksikan perubahannya. Semoga bermanfaat…

Wassalamualaikum wr, wb.. :)

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=290 5 jQuery Plugin Content Rotator http://agoesdoubleb.i-bego.com/?p=288 http://agoesdoubleb.i-bego.com/?p=288#comments Fri, 25 Jun 2010 03:45:43 +0000 admin http://agoesdoubleb.i-bego.com/?p=288 Assalamualaikum wr, wb

Abis nyobain bikin plugin jQuery….
Silahkan diicip http://agoesdoubleb.i-bego.com/arsip/ag … index.html

Di beri nama Agoes-ContentRotator v.01 

// JavaScript Document
(function($){
$.fn.agoesCRotator = function(options){
var s = {
auto : false
, control : true
, speed : 500
, next_text : "Next"
, pref_text : "Prev"
, next_image : ""
, pref_image : ""
, next_class : "aCRnext" 
, prev_class : "aCRprev"
, control_class : "aCRcontrol"
, width : 600
, height : 200
, current : 1 
};
s = $.extend(options, s);
var current = 1;
return this.each(function(){
var $this = $(this);
var $kids = $this.children();
var l = $kids.length;
$this.wrap("<div class='aCRcontainer'></div>");
$this.parent().css({
"posision" : "relative"
, "width" : s.width
, "min-height" : s.height
, "overflow-x" : "hidden"
, "overflow-y" : "auto"
});
$this.addClass("aCRgerak");
$this.css({
"posision" : "relative"
, "width" : "9000px"
, "height" : s.height
, "padding" : "0px"
, "left" : "0px"
});
$this.children().css({
"posision" : "relative"
, "width" : s.width
, "height" : s.height
, "overflow" : "hidden"
, "float" : "left"
, "border" : "none"
});
if(s.control){
$this.parent().append("<div class='aCRcontrolContainer'></div>");
$this.parent().find(".aCRcontrolContainer").css({
"height" : "20px"
, "padding-left" : "50px"
});

$kids.each(function(i){
$this.parent().find(".aCRcontrolContainer").append(
"<a id='aCRcontrol"+i+"' href='#' class='"+s.control_class+"'>"+(i+1)+"</a>"
);
var $a = $this.parent().find(".aCRcontrolContainer").find("a#aCRcontrol"+i);
$a.click(function(){
$this.stop();
geser_obj(i+1);
});

}
);
};
function geser_obj(i){
var pantul = 100;
var jauh = 80;
var selisih = (i<s.current)?s.current-i : i- s.current;
if(i<s.current){
$this.animate({
"left" : "+=" + ((s.width * (selisih)) + (selisih*pantul))
}, s.speed).animate({"left":"-="+(selisih*pantul)}, (selisih*jauh));
s.current = i;
}else if(i>s.current){
$this.animate({
"left" : "-=" + ((s.width * (selisih)) + (selisih*pantul))
}, s.speed).animate({"left":"+="+(selisih*pantul)}, (selisih*jauh));
s.current = i;
}
$this.parent().find(".aCRcontrolContainer").find("a").removeClass("controlSelect");
$this.parent().find(".aCRcontrolContainer").find("a#aCRcontrol"+(i-1)).addClass("controlSelect");
};
}
);
};
})(jQuery);



Cara Pakai, siapkan sebuah div sebagai container dan di dalamnya diletakkan div lain yang akan menjadi isinya

<div id="content">
<div style="width:600px; height:300px; ">
<img src="images/Chrysanthemum.jpg" align="left" width="200" />
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
<div style="width:600px; height:300px; ">
<img src="images/Desert.jpg" align="left" width="200" />
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
<div style="width:600px; height:300px; ">
<img src="images/Hydrangeas.jpg" align="left" width="200" />
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
<div style="width:600px; height:300px; ">
<img src="images/Jellyfish.jpg" align="left" width="200" />
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
<div style="width:600px; height:300px; ">
<img src="images/Koala.jpg" align="left" width="200" />
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
</div>



Untuk Pemanggilan fungsi dapat dilakukan dengan melakukan seleksi pada objek div yang menjadi container

<script>
$(function(){
$("div#content").agoesCRotator();
}
);
</script>


Masih sekedar coba2 yang ingin mengembangkan bersama >:D< >:D< Silahkan…

Terima kasih Wassalam… B-)

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=288 3 Penerapan AJAX menggunakan anaa ajax framework #1 http://agoesdoubleb.i-bego.com/?p=285 http://agoesdoubleb.i-bego.com/?p=285#comments Sun, 13 Jun 2010 05:58:49 +0000 admin http://agoesdoubleb.i-bego.com/?p=285 Assalamualaikum wr, wb….

Mari belajar tentang AJAX.

Kali ini saya ingin memperkenalkan tentang sebuah framework ajax bernama anaa

Disini sitenya http://www.scriptol.com/ajax/anaa/

Dalam framework ini terdapat beberapa API yang dapat kita gunakan untuk mempermudah penerapan AJAX pada website yang kita buat….
AACreate, AARead, AALoadXML, AALoadHTML, AAWrite dll

Langsung saja saya berikan demonya, untuk pertama AARead saja dulu….

Demo : http://agoesdoubleb.i-bego.com/arsip/an … /index.php
Perhatikan ketika menu di tekan, isi tampilan utama akan secara otomatis berubah tanpa merubah URL dari website….

AARead berfungsi untuk membaca sebuah dokumen pada server….

Sediakan sebuah file bernama index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" dir="ltr" lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>Anaa, demo of get from plain text</title> 


<script src="anaa.js" type="text/javascript"></script> 
<script language="JavaScript"> 

function storing(data, element)
{
element.innerHTML = data;
}

function loadContent(url, element)
{ 
AARead(url, storing, element);
} 

</script> 

</head> 


<body bgcolor="#FFFFCC">
<p><a href="index.php">Home</a> | 
<a href="#" onclick="loadContent('profile.php',document.getElementById('dvMain'));">Profile</a> | 
<a href="#" onclick="loadContent('contact.php',document.getElementById('dvMain'));">Contact</a> | 
<a href="#" onclick="loadContent('help.php',document.getElementById('dvMain'));">Help</a></p>
<div id="dvMain" style="width:300px; height:200px; border:solid #000 thin;">Home</div>
</body> 

</html>

anaa.js (file ini dapat di download dari link yang saya sertakan diatas)

/**
AnAA - Ajax Framework
Version 1.8
www.anaa.eu
(c) 2007-2009 Sandrine Takis and Denis Sureau.
Free under the GNU GPL 2.0 Licence.
*/   

var AACaching = false;


function AACreate() 
{
var request = false;
try {
request = new ActiveXObject('Msxml2.XMLHTTP');
}
catch (err2) {
try {
request = new ActiveXObject('Microsoft.XMLHTTP');
}
catch (err3) {
try {
request = new XMLHttpRequest();
}
catch (err1) 
{
request = false;
}
}
}
return request;
}


/**
AA Read
Load a file, text or XML
*/   

function AARead(url, fun, element)
{ 
var xhr = AACreate();
var ext = url.substr(url.length - 3);
var isXML =  (ext == "xml");   

xhr.onreadystatechange=function()
{ 
if(xhr.readyState == 4)
{
if(xhr.status == 200)
{
var content;
if(isXML) 
content = xhr.responseXML;
else
content = xhr.responseText;
fun(content, element);
}
} 
}; 

if(AACaching == false)
url = url + "?nocache=" + Math.random();
xhr.open("GET", url , true);
xhr.send(null); 
} 

/**
Read an XML file with any extension
*/

function AALoadXML(url, fun, element)
{ 
var xhr = AACreate();
xhr.onreadystatechange=function()
{ 
if(xhr.readyState == 4)
{
fun(xhr.responseXML, element);
} 
}; 
xhr.open("GET", url , true);
xhr.send(null); 
} 

/**
AAWrite
url:   the script
data:   the string to pass to the script
it is a list of pairs x=y separated by &
*/   

function AAWrite(url, data, fun)
{ 
var xhr = AACreate();

xhr.onreadystatechange=function()
{ 
if(xhr.readyState == 4)
{
if(fun != null) fun(xhr.responseText);
}
}; 
xhr.open("POST", url, true);      
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data); 
} 


function AAGetBody(content)
{
var x = content.indexOf("<body");
if(x == -1) return "";

x = content.indexOf(">", x);
if(x == -1) return "";

var y = content.lastIndexOf("</body>");
if(y == -1) return "";

return content.slice(x + 1, y);
}

function AAPutHTML(content, target)
{
target.innerHTML = AAGetBody(content);
}

/**
Loads a HTML page
Put the content of the body tag into the current page.
Arguments:
url of the other HTML page to load
id of the tag that has to hold the content
*/      

function AALoadHTML(url, fun, storage, param)
{
var xhr = AACreate();
xhr.onreadystatechange=function()
{ 
if(xhr.readyState == 4)
{
if(xhr.status == 200)
{
storage = document.getElementById(storage);
storage.innerHTML = AAGetBody(xhr.responseText);
fun(storage, param);
}
} 
}; 

if(AACaching == false)
url = url + "?nocache=" + Math.random();
xhr.open("GET", url , true);
xhr.send(null); 

} 


/**
Send a HEAD request,
call a function with the value 
*/

function AAHead(url, key, fun, element)
{ 
var xhr = AACreate();

xhr.onreadystatechange = function() 
{
if(xhr.readyState == 4) 
{
var value;
if (xhr.status == 200)
{ 
value = xhr.getResponseHeader(key);
}
else 
{
if(xhr.status==404) 
value = url + " doesn't exist!";
else 
value = "Error, status is " + xhr.status;
}
fun(value, element);      
}
}
xhr.open("HEAD", url, true);
xhr.send(null); 
} 

profile.php, contact.php dan help.php

Isikan sesuai dengan apa yang ingin di tampilkan

Semoga bisa membuat tutorial selanjutnya tentang anaa… :D

Wassalamualaikum wr, wb…
:ar!

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=285 5 Free Download Al-Qur’an Digital http://agoesdoubleb.i-bego.com/?p=281 http://agoesdoubleb.i-bego.com/?p=281#comments Tue, 25 May 2010 00:51:44 +0000 admin http://agoesdoubleb.i-bego.com/?p=281 Assalamualaikum wr, wb….

Sibuk dengan pekerjaan yang menyita waktu, membuat kita melupakan untuk membaca Al-Qur’an….

Bagi teman2 yang biasa bekerja di depan komputer…. Silahkan di download qur’an digital ini… Baik di baca di sela-sela pekerjaan….

http://www.4shared.com/file/ihcj-_v7/AlQuranDigital21.html

http://www.4shared.com/file/ihcj-_v7/AlQuranDigital21.html

Terima kasih

Wassalamualaikum wr, wb…

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=281 0 RAHASIA SEBERKAS CAHAYA http://agoesdoubleb.i-bego.com/?p=279 http://agoesdoubleb.i-bego.com/?p=279#comments Sun, 23 May 2010 05:17:09 +0000 admin http://agoesdoubleb.i-bego.com/?p=279 Assalamualaikum Wr, Wb….

Hampir satu bulan tidak update Blog dikarenakan kesibukan di dunia nyata heuh…. ;-) Mari kita refreshing sejenak…

Di bawah adalah sebuah tulisan dari seorang teman, Her name is Lyta. Tulisan yang sangat menginspirasi, moga dapat bermanfaat bagi siapa saja yang membacanya… :)

—————————————————————————————

Banyak kegagalan dalam hidup ini dikarenakan orang-orang tidak menyadari betapa dekatnya mereka dengan keberhasilan saat mereka menyerah. Kalimat tersebut tentunya sangat familiar di telinga kita. Thomas Alva Edison, seorang penemu dengan 1.093 hak paten yang dalam hidupnya hanya bersekolah selama tiga bulan, terlahir dalam keluarga miskin, penderita disfungsi, agak tuli pula. Alva juga seorang penderita dyslexia yaitu sebuah kondisi ketidakmampuan belajar pada seseorang yang disebabkan oleh kesulitan pada orang tersebut dalam melakukan aktivitas membaca dan menulis. Tak heran bila Alva dikenal sebagai anak yang bodoh oleh gurunya. Lalu mengapa dia bisa menjadi orang yang istimewa sekarang?

Kawan, sekarang bukan saatnya untuk bertanya mengapa. Mengapa aku terlahir sebagai lelaki? Atau mengapa aku terlahir sebagai perempuan? Atau tidak kedua-duanya, misalnya? Mengapa aku terlahir sebagai anak dari keluarga miskin? Atau mengapa aku terlahir sebagai anak dari keluarga kaya yang miskin kasih sayang? Apalagi bertanya : mengapa aku terlahir dengan wajah sedikit cakep dan banyak jeleknya? Semua itu adalah pertanyaan yang kerap dilontarkan oleh teman-teman kita, saudara kita, tetangga kita, tetangga saudara kita, saudara tetangga kita, atau bahkan oleh kita sendiri. Kita? Lu aja kali, gue enggak!

Namun pertanyaan yang ada dibenakku adalah : Mengapa aku terlahir sebagai manusia? Tidak hewan atau tumbuhan, makhluk yang paling pendiam sedunia. Tumbuhan, makhluk yang paling kaya. Hmm…, bukankah diam adalah emas?
Yeah, sekarang bukan saatnya untuk bertanya mengapa. Mengapa aku diciptakan sebagai manusia? Tidak malaikat, misalnya. Hmm…, siapa juga yang ingin terlahir sebagai s****(maaf, kata tersebut tidak dapat ditampilkan karena tidak lulus sensor). Namun setidaknya semua yang telah ada patut untuk disyukuri, Kawan.

Mungkin aku bukanlah seorang Thomas Alva Edison. Aku hanyalah seorang pemalas yang sering menunda-nunda pekerjaan dan ditakdikan memiliki segudang kekurangan dalam hidupku. Yeah, segalanya patut disyukuri, Kawan. Sekaranglah saatnya untuk berpikir positif bahwa kekurangan adalah kelebihan yang tidak dimiliki orang lain. Bukankah masalah akan mudah dipecahkan dengan cara mengubah cara pandang kita?

Hidup bagaikan sebuah perjalanan yang mungkin semasa hidup, kita membangun sebuah istana untuk tempat berteduh tapi, bukan suatu tujuan akhir. Biarkanlah istana itu dijadikan tempat berteduh untuk orang lain dan kita melanjutkan perjalanan lagi. Hidup penuh dengan pilihan. Semua yang terjadi dalam hidup, sebab-akibat yang terjadi bukan karena takdir, tapi akibat dari pilihan kita.

Dalam perjalananku, aku menemukan banyak pilihan, tak sedikit kegagalan, jatuh bangun, dan tentu saja impian yang ingin aku raih. Aku menyadari, aku adalah orang yang mudah putus asa dibanding Alva (sok akrab!) yang pantang menyerah melakukan percobaan dalam menemukan penemuan-penemuannya. Namun setidaknya aku selalu berusaha bangkit di setiap kegagalan yang terjadi. Bukankah jatuh adalah hal biasa dan bangkit adalah sesuatu yang luar biasa? Dan tentunya, aku selalu takut ketika aku berhenti untuk berusaha. Siapa yang tahu jika keberhasilan datang setelah ini! Bukankah perasaan mampu dan tidak mampu seringkali hanya dibatasi selembar kemauan?
Kawan, ada satu hal yang selalu aku yakini bahwa kesuksesan akan mengikuti orang-orang besar yaitu orang-orang yang mau belajar dan bekerja keras.
Seperti kata Alva, “Menjadi jenius butuh 1% inspirasi dan 99% kerja keras.” Kalimat itu selalu terngiang-ngiang di otakku setiap kali aku melihat cahaya. Dan penemuan Alva berupa bohlam adalah wujud nyata betapa indahnya cahaya ilmu pengetahuan. Bagaikan seberkas cahaya dengan kecepatan 3x 108 yang melesat menerangi otakku, Alva memberiku inspirasi menaklukan setiap jalan terjal dalam perjalanan panjang ini.
Jangan biarkan keterpurukan mengalahkanmu karena waktu tidak akan berhenti untuk menunggumu. Kawan, jika suatu saat kau terjatuh dalam hidupmu, lalu kalimat tokoh besar sekalipun tak mampu membuatmu bangkit dan menginspirasimu, buatlah dirimu sendiri menjadi inspirasi. Yakinlah pada kekuatan besar yang ada pada dirimu karena sekuat apa diri kita adalah apa yang kita yakini.

————————————————————————–

Sekian Wassalamualaikum, wr, wb

Original Post http://www.facebook.com/note.php?note_id=391792091945

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=279 0 PHP Image Resizer Function http://agoesdoubleb.i-bego.com/?p=276 http://agoesdoubleb.i-bego.com/?p=276#comments Fri, 30 Apr 2010 05:56:51 +0000 admin http://agoesdoubleb.i-bego.com/?p=276 Salam… B-)

Kali ini saya akan sedikit berbagi tutorial tentang cara merubah ukuran image yang ditampilkan pada halaman website….

Ok seperti biasa, Demo http://agoesdoubleb.i-bego.com/arsip/ge … /index.php

Ukuran gambar akan disesuaikan dengan maximal width atau height yang kita tetapkan…

script index.php

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Image Resizer</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.cImage{
width:100px;
height:100px;
border-style:dashed;
border-color:#990000;
border-width:thin;
background-color:#CCCCCC;
overflow:hidden;
margin:5px;
float:left;
text-align:center;
vertical-align:middle;
}

.cImage:hover{
background-color:#666666;
cursor:pointer;
}

.cImage img{
border-style:solid;
border-color:#000000;
border-width:thin;
margin:auto 0px auto 0px auto;
}
</style>
</head>
<body>

<?php
function printResizeImage($image, $size){
if(file_exists($image)){
$sizes = GetImageSize($image);
$wi = ($sizes[0]>$sizes[1]) ? $size : ($sizes[0] / $sizes[1]) * $size;
$hi = ($sizes[0]>$sizes[1]) ? ($sizes[1] / $sizes[0]) * $size : $size;
return "<img src=\"$image\" width=$wi height=$hi />";
}
}
echo "<div style=\"width:450px; margin:0 auto;\">";
echo "<div class=\"cImage\">".printResizeImage("0536.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("0537.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("0538.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("0539.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("0540.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("0541.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("0542.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("0543.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("0544.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("T876.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("T878.jpg", 100)."</div>";
echo "<div class=\"cImage\">".printResizeImage("T879.jpg", 100)."</div>";
echo "</div>";
?>
</body>
</html>



GetImageSize merupakan function yang disediakan oleh PHP untuk mengembalikan nilai lebar dan tinggi suatu file image, selanjutnya tinggal kita sesuaikan ukurannya sesuai dengan yang kita inginkan…. ;;) ;;)

Sekian dan Moga bermanfaat…

Salam :-B

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=276 1 Export Data from PHP to Excell File http://agoesdoubleb.i-bego.com/?p=273 http://agoesdoubleb.i-bego.com/?p=273#comments Thu, 29 Apr 2010 09:37:51 +0000 admin http://agoesdoubleb.i-bego.com/?p=273 Salam B-)

Sedikit tutorial untuk export data from database using PHP to Excell File….

Demonya disini http://agoesdoubleb.i-bego.com/arsip/pr … /index.php

index.php

<?php
$hostname_cobadb = "localhost";
$database_cobadb = "sensor";
$username_cobadb = "sensor";
$password_cobadb = "sensor";
$cobadb = mysql_pconnect($hostname_cobadb, $username_cobadb, $password_cobadb) or trigger_error(mysql_error(),E_USER_ERROR); 

mysql_select_db($database_cobadb, $cobadb);
$query_recMember = "SELECT `uname`, `ubirthday` FROM tusers where utype=3 or utype=0";
$recMember = mysql_query($query_recMember, $cobadb) or die(mysql_error());
$row_recMember = mysql_fetch_assoc($recMember);
$totalRows_recMember = mysql_num_rows($recMember);

header("Pragma: public");
header("Expires: 0");
header("Cache-Control: must-revalidate, post-check=0, pre-check=0"); 
header("Content-Type: application/force-download");
header("Content-Type: application/octet-stream");
header("Content-Type: application/download");;
header("Content-Disposition: attachment;filename=printmember.xls "); 
header("Content-Transfer-Encoding: binary ");

echo "Data Member forum.i-bego.com";
echo "<table border=\"1\">";
echo "<tr><td><b>No</b></td>";
echo "<td><b>Username</b></td>";
echo "<td><b>Date Birth</b></td>";
echo "</tr>";
$i=1;
do { 
echo "<tr>";
echo "<td>$i</td>"; 
echo "<td>".$row_recMember['uname']."</td>"; 
echo "<td>".$row_recMember['ubirthday']."</td>"; 
echo "</tr>";
$i++;
} while ($row_recMember = mysql_fetch_assoc($recMember)); 

echo "</table>";
?>


Inti dari kode ini adalah disini

header("Pragma: public");
header("Expires: 0");
header("Cache-Control: must-revalidate, post-check=0, pre-check=0"); 
header("Content-Type: application/force-download");
header("Content-Type: application/octet-stream");
header("Content-Type: application/download");;
header("Content-Disposition: attachment;filename=printmember.xls "); 
header("Content-Transfer-Encoding: binary ");



Selanjutnya di bagian bawah bisa di tulis data yang ingin di tampilkan…. ;-) ;-)

Moga bermanfaat…. 

Salam :-B

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=273 0 Javascript Window Opener http://agoesdoubleb.i-bego.com/?p=270 http://agoesdoubleb.i-bego.com/?p=270#comments Tue, 27 Apr 2010 10:13:47 +0000 admin http://agoesdoubleb.i-bego.com/?p=270 Salam, B-)

Sedikit tutorial memanfaatkan window open dalam Javascript…. 

Pada script berikut terdapat sebuah button yang berfungsi untuk membuka window lain, dimana pada window tersebut terdapat hasil generate web color… Setelah salah satu warna di klik, maka fungsi javascript akan mengirimkan perintah pada window yang membukanya dengan merubah background color dari window tersebut sesuai dengan yang dipilih pada kotak warna…. ;-)



Script index.php

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Color Window Opener</title>
<style type="text/css"> 
/* <![CDATA[ */
body {
color: #fff;
}

td {
border: solid 1px #333; 
}

.over { 
border-color: white; 
}

.out {
border-color: #333333; 
}

img {
border: 0;
}
/* ]]> */
</style> 
<script type="text/javascript">
function popup(url, width, height, name)
{
if (!name)
{
name = '_popup';
}

window.open(url.replace(/&amp;/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes, width=' + width);
return false;
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<?php if($_GET['view']=='color'){ ?>
<script type="text/javascript"> 
// <![CDATA[
var r = 0, g = 0, b = 0;

var numberList = new Array(6);
numberList[0] = '00';
numberList[1] = '33';
numberList[2] = '66';
numberList[3] = '99';
numberList[4] = 'CC';
numberList[5] = 'FF';

document.writeln('<table cellspacing="0" cellpadding="0" border="0">');

for (r = 0; r < 6; r++)
{
for (g = 0; g < 6; g++)
{
if((g==0)|(g==3))document.writeln('<tr>');
for (b = 0; b < 6; b++)
{
color = String(numberList[r]) + String(numberList[g]) + String(numberList[b]);
document.write('<td style="background-color: #' + color + ';" onmouseover="this.className=\'over\'" onmouseout="this.className=\'out\'">');
document.write('<a href="#" onclick="cell(\'' + color + '\'); return false;"><img src="./../images/spacer.gif" width="15" height="12" alt="#' + color + '" title="#' + color + '" \/><\/a>');
document.writeln('<\/td>');
}
if((g==2)|(g==5))document.writeln('<\/tr>');;
}
}
document.writeln('<\/table>');

function cell(color)
{
opener.document.getElementsByTagName('body')[0].style.background = '#'+color;
window.close();
}
// ]]>
</script> 
<?php exit; } ?>
<input type="button" name="Submit" value="Change Background" onClick="popup('index.php?view=color', 320, 200, '_swatch');">
</body>
</html>

Silahkan dicoba sendiri….

Terima kasih, Salam :-B

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=270 0 PHP + Javascript Multiple Upload http://agoesdoubleb.i-bego.com/?p=264 http://agoesdoubleb.i-bego.com/?p=264#comments Tue, 27 Apr 2010 05:25:52 +0000 admin http://agoesdoubleb.i-bego.com/?p=264 Salam B-)

Iseng2 bikin script buat bikin multiple upload, macam yang digunakan di cpanel namun dengan sistem upload clasic…..

Perbedaan dari form upload disini, kita bisa menentukan jumlah file yang akan diupload sesuai dengan keinginan kita….

Seperti ini tampilannya…

Image




Scriptnya seperti ini index.php

<?php
if (isset($_POST['file_name'])){
$file_name   = $_POST['file_name'];
for($i = 0; $i < count($_FILES); $i++)
$AFile[$i] = $_FILES['file'.$i];

if(!is_dir("file"))mkdir("file");
$dir_path = "file/".strip_tags($file_name);
if(!is_dir($dir_path))mkdir($dir_path);

if(is_array($AFile)){
for($i=0; $i < count($AFile); $i++){
move_uploaded_file($AFile[$i]['tmp_name'],$dir_path."/".$AFile[$i]['name']);
}
}
echo "<script>alert('Upload file Sukses');</script>";
}
?>


<style>
.textfield{
background-color:#CCCCCC;
border-style:solid;
border-width:thin;
}
.button{
background-color:#CCCCCC;

border-bottom-style:solid;
border-bottom-width:thin;
border-bottom-color:#000000;

border-top-style:solid;
border-top-width:thin;
border-top-color:#000000;
}
.button:hover{
background-color:#333333;
color:#CCCCCC;
}
</style>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post" enctype="multipart/form-data" name="form1" id="form1">
<table border="0" align="center">
<tr>
<td colspan="2"><div><strong>Input Files</strong></div></td>
</tr>
<tr>
<td width="220">Folder Name</td>
<td><label>
<input name="file_name" type="text" id="file_name" size="50" maxlength="100" value=""/>
</label></td>
</tr>
<tr>
<td valign="top">File Upload </td>
<td>
<div id="ct_file">
1. <input name="file0" type="file" id="file0" size="50" maxlength="125" value=""/><br />
</div>   
<script type="text/javascript">
var jml = 1;
</script>
<input type="button" onClick="document.getElementById('ct_file').innerHTML += (jml+1)+'. <input name=file'+jml+' type=file id=file'+jml+' size=50 maxlength=125><br />';jml++;" value="Tambah File">
File yang diijinkan adalah : zip. 
</td>
</tr>
<tr>
<td colspan="2" style="padding:3px;"><label>
<input type="submit" name="Submit" value="Submit" />
<input type="reset" name="Reset" value="Reset" />
</label></td>
</tr>
</table>
</form>



Terima kasih…. Moga Bermanfaat…..

Salam…. :-B

]]> http://agoesdoubleb.i-bego.com/?feed=rss2&p=264 0