Sharing Ilmu WEB-Design

Topik sebelumnya Topik selanjutnya Go down

Sharing Ilmu WEB-Design

Post by Renato.R.Junior on Sun Nov 02, 2008 6:21 pm

Yo... kita sharing ilmu web-design yuk...

yang punya ilmu tentang bahasa pemograman web seperti :

php-html-xhtml-css-js-vbs-asp-flash

atau ilmu desain graphic web

silahkan berbagi disini yah....., tapi non-template......

saya mulai

injeksi css dengan js

Code:
function CssMod() {
  if(window.cssinjected == undefined) {
      cssinjected = 1;
      var css = document.createElement("link");
      css.setAttribute("type","text/css");
      css.setAttribute("rel","stylesheet");
      css.setAttribute("href","Renato.css"); <-- ini  link css-nya
      css.setAttribute("media","screen, print");      document.getElementsByTagName("head")[0].appendChild(css);
  }
}CssMod();

ini code js jadi klo di html pake pembukanya yaitu
Code:
<script language="Javascript" type="text/javascript"> code nya disini </script>

atau save aja dengan extensi .js

berikutnya cara buat forum sendiri......cmn agak panjang jadi kita liat yg lain dulu..


Terakhir diubah oleh Renato.R.Junior tanggal Sun Nov 02, 2008 6:26 pm, total 2 kali diubah (Reason for editing : lengkapin)

Renato.R.Junior
Super Senior
Super Senior

Jumlah posting : 199
Join date : 02.11.08
Age : 27
Lokasi : UnderNet

Lihat profil user http://ignismagus.net63.net/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by lkٮچ on Mon Nov 03, 2008 2:26 pm

wah bagus neeh... ayo om terusin,kebetulan pengen beljar JS neeh, klo bisa seh dari dasar pisan. Css juga om aduh bingung ... kalo bahasa html sih dah rada mendingan, bisa2 dikit lah Very Happy .

terusin ya... sy tunggu.


_______________________________________________________________________________

PM Me With Yahoo Messenger

lkٮچ
Senior
Senior

Jumlah posting : 74
Join date : 01.08.08
Lokasi : Mangkubumi

Lihat profil user http://blackcurut.blogspot.com/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by Renato.R.Junior on Mon Nov 03, 2008 2:36 pm

ok...

nih cara bikin status bar kamu gerak di e-explorer mau mozila atau yg lain

Code:
ketik = new Object(); [bikin objek baru]

ketik.speed = 50;    [bikin propertinya]
ketik.refresh = 1000;
ketik.loop = true;

function statusketik(MESSAGES,SPEED,REFRESH,LOOP) {
  cancelStatusEffects();
  ketik.tempMessages = MESSAGES.split(',');
  ketik.tempSpeed = (SPEED != null) ? SPEED : ketik.speed;
  ketik.tempRefresh = (REFRESH != null) ? REFRESH : ketik.refresh;
  ketik.tempLoop = (LOOP != null) ? LOOP : ketik.loop;
  ketik.tempLoop += '';
  if (ketik.tempLoop == 'true') ketik.tempLoop = -1;
  else if (ketik.tempLoop == 'false') ketik.tempLoop = 1;
  else ketik.tempLoop = parseInt(ketik.tempLoop);
  ketik.messageIndex = 0;
  ketik.positionIndex = 0;
  ketik.isActive = true;
  activateketik();
  }

function cancelStatusEffects() {
  ketik.isActive = false;
  window.status = window.defaultStatus;
  }


function activateketik() {
  if (ketik.isActive) {
      var currentMessage = ketik.tempMessages[ketik.messageIndex];
      var tempMessage = currentMessage.substring(0,ketik.positionIndex);
      window.status = tempMessage;
      if (ketik.positionIndex < currentMessage.length) {
        ketik.positionIndex++;
        window.setTimeout('activateketik()',ketik.tempSpeed);
        }
      else {
        ketik.positionIndex = 0;
        ketik.messageIndex = (ketik.messageIndex < ketik.tempMessages.length - 1) ? ketik.messageIndex + 1 : 0;
        if (ketik.messageIndex == 0) ketik.tempLoop--;
        if (ketik.tempLoop == 0) ketik.isActive = false;
        else window.setTimeout('activateketik()',ketik.tempRefresh);
        }
      }
  }

tinggal gunain fungsi statusketik...

cuma ini kan code masih berdiri sendiri alias akhiran js...

jadi klo mau di html pke code pembuka script...

Renato.R.Junior
Super Senior
Super Senior

Jumlah posting : 199
Join date : 02.11.08
Age : 27
Lokasi : UnderNet

Lihat profil user http://ignismagus.net63.net/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by networker on Thu Nov 06, 2008 12:07 pm

om minta tutor about css buat pemula donks............... rada ngak ngarti neeh Sad pliss belum nemu yang pas buat pemula..soalnya semua tutor yang aku dapet ngak cocok Sad


thaks sebelumnya......

networker
Junior
Junior

Jumlah posting : 27
Join date : 06.11.08

Lihat profil user

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by Renato.R.Junior on Thu Nov 06, 2008 3:04 pm

hmmm...tutor yah... ada sih cmn bahasa inggris..., klo mau saya upload.....,

tapi buat belajar css meningan belajar sendiri pke cara otak-atik :

1. copy css orang
2. coba ubah beberapa codenya dan liat apa yang terjadi....

dan dianjurin kamu punya localhost sendiri...



dengan cara pakai IIS.., atau app server lainya .., klo mau gampang pakai Nusphere dia langsung nyediain localhost..........

klo ada localhost atau server sendiri code net jadi bisa otak-atik di rumah tanpa ngehost ke internet terlebih dahulu..

Renato.R.Junior
Super Senior
Super Senior

Jumlah posting : 199
Join date : 02.11.08
Age : 27
Lokasi : UnderNet

Lihat profil user http://ignismagus.net63.net/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by networker on Sat Nov 15, 2008 10:57 am

ooo... supaya bisa baca css musti pake web server toh.... Oke deh. pelajaran pertama mungkin ngotak ngatik css orang Very Happy selanjutnya create sendiri........
thanks

networker
Junior
Junior

Jumlah posting : 27
Join date : 06.11.08

Lihat profil user

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by kristz07 on Sat Nov 15, 2008 2:00 pm

@renato

om, software'nya posting sini dong. . . soalnya ane liat2 tu software cuman trialnya doank

kristz07
Administrator
Administrator

Jumlah posting : 890
Join date : 20.04.08
Age : 28
Lokasi : tasikmalaya

Lihat profil user

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by Renato.R.Junior on Mon Nov 17, 2008 10:36 am

yah boleh...aja cmn bener gk apa-apa perlu persetujuan admin dulu yah... soalnya kan forum ini pakai nice-forum bkn host sndiri jdi piracy atau software sharing dilarang nanti di baned lg... klo mau sya e-mailin atau di migrasi aja ke 00webhosting disana bebas da dikasih space gede n free

Renato.R.Junior
Super Senior
Super Senior

Jumlah posting : 199
Join date : 02.11.08
Age : 27
Lokasi : UnderNet

Lihat profil user http://ignismagus.net63.net/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by Renato.R.Junior on Mon Nov 17, 2008 11:10 am

networker wrote:ooo... supaya bisa baca css musti pake web server toh.... Oke deh. pelajaran pertama mungkin ngotak ngatik css orang Very Happy selanjutnya create sendiri........
thanks

enggak juga kok..., localhost itu cuman buat memungkinkan kita untuk membuat kode-kode bersifat server seperti membership atau posting....dan mengetes pembuatan security kalau css pakai frontpage atau notepad juga bisa.

klo css

sperti
Code:

* {
   
   margin: 0;
   padding: 0;
}
maka browser baik ie atai frfx akan mereset margins, padding dan ukuran hurufnya
Code:

body {
background-image: url(lokasinya); [lokasi gambar bg]
        background-attachment: fixed; [maka posisi lampiran bg akan fix]
  background-position: center top; [lokasi penempatan bg]
  background-repeat: no-repeat; [perulangan bila ukuran max sudah terlewat]
  background-color: #000000; [warna dasar]
   font-family: Verdana, Helvetica, Arial, sans-serif;
   color: #828282;
   font-size: 10px;
   margin: 0;
   padding: 15px 0;
   

}

cohtoh body diatas...
tanpa code css pun bisa dilakukan
namun bila ingin bg dengan css maka di coding pusat kita memasukan
Code:

<link href="lokasi" rel="stylesheet" type="text/css" media="screen, projection" />

untuk animasi pada button saat hover dan click pun biasanya menggunakan css...pengubahan ukuran huruf pun..dengan css berganda..

Renato.R.Junior
Super Senior
Super Senior

Jumlah posting : 199
Join date : 02.11.08
Age : 27
Lokasi : UnderNet

Lihat profil user http://ignismagus.net63.net/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by Renato.R.Junior on Mon Nov 17, 2008 11:17 am

Q : digunakan dimana css..? yg kita tulis ?

R :

tag
contoh css
Code:

<style type="text/css" media="screen" class="Flasha">
<!--
.Flasha {
   background-attachment: fixed;
   background-repeat: no-repeat;
   background-position: center center;
   text-align: center;
   clear: both;
   float: left;
   overflow: hidden;
   position: relative;
   visibility: visible;
   z-index: auto;
   cursor: hand;
   page-break-before: auto;
   page-break-after: auto;
      height: auto;
   width: 702;
}
-->
</style>

<ul class="class css yg kita koding sebelumnya"> </ul>
maka dalam class kita tulis flasha, semua yg didalam tag tersebut akan menuruti koding css baik pewarnaan maupun apakah itu tersebunyi atau terlihat

atau
<div> </div>
<dl> </dl>
perbedaanya silahkan utak-atik sendiri good luck yah...

Renato.R.Junior
Super Senior
Super Senior

Jumlah posting : 199
Join date : 02.11.08
Age : 27
Lokasi : UnderNet

Lihat profil user http://ignismagus.net63.net/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by x-code on Thu Dec 18, 2008 11:42 pm

Kayak nya klo dasar enakan mulai dari friendster dulu dah ... Very Happy
Jadi Layout nya kita bikin ndiri, pake linker Smile



__________________________________________________________________________
I Love Google 4ever ... study

x-code
Junior
Junior

Jumlah posting : 15
Join date : 18.12.08
Age : 29
Lokasi : simpang 5

Lihat profil user http://simpang5-gank.co.cc ,  http://gie-doank.blogspot.com

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by lkٮچ on Fri Dec 19, 2008 10:51 am

halow.. nih ada js dikit dapet mungut di dynamicdrive, lumayan buat yang suka nge-Blog buat nambah2 asesorisna Very Happy ..... judulna Animated Browser Opener. Nih Scriptna :

Code:
<script>
<!--


var winheight=100
var winsize=100
var x=5

/*
Animated Window Opener Script (updated 00/04/24)-
Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions, 100's more DHTML scripts, and Terms Of
Use, visit dynamicdrive.com
*/



function openwindow(thelocation){
temploc=thelocation
if (!(window.resizeTo&&document.all)&&! (window.resizeTo&&document.getElementById)){
window.open(thelocation)
return
}
win2=window.open("","","scrollbars")
win2.moveTo(0,0)
win2.resizeTo(100,100)
go2()
}
function go2(){
if (winheight>=screen.availHeight-3)
x=0
win2.resizeBy(5,x)
winheight+=5
winsize+=5
if (winsize>=screen.width-5){
win2.location=temploc
winheight=100
winsize=100
x=5
return
}
setTimeout("go2()",50)
}
//-->
</script>

<p><a href="javascript:openwindow('http://link_yang_dituju.com')">Open window</a>

Catatan:
http://link_yang_dituju.com = Ganti dengan link yang akan dituju.
Open window = Teks / gambar yang akan di tampilkan di blog.

Untuk Preview na Klik disini. Kalo udah masuk trus klik Image Go to My Site untuk melihat hasil dari script di atas, seperti itulah kira-kira hasilna Very Happy selamat Nge-Blog ria.

NB: Kalo mau lebiah simple upload dulu script di atas ke webhost kalian, biar kodena jadi dikit bounce


_______________________________________________________________________________

Bilih Bade ngobrol Lewat YM

lkٮچ
Senior
Senior

Jumlah posting : 74
Join date : 01.08.08
Lokasi : Mangkubumi

Lihat profil user http://blackcurut.blogspot.com/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by Renato.R.Junior on Fri Dec 19, 2008 1:47 pm

seep deh ^^

Renato.R.Junior
Super Senior
Super Senior

Jumlah posting : 199
Join date : 02.11.08
Age : 27
Lokasi : UnderNet

Lihat profil user http://ignismagus.net63.net/

Kembali Ke Atas Go down

Re: Sharing Ilmu WEB-Design

Post by Sponsored content Today at 12:20 am


Sponsored content


Kembali Ke Atas Go down

Topik sebelumnya Topik selanjutnya Kembali Ke Atas

- Similar topics

 
Permissions in this forum:
Anda tidak dapat menjawab topik