Slide bandı

alltiger · 28 Mart 2011

Merhaba arkadaşlar,

<Bu> sitedeki portfolyo kısmında bulunan ve üzerine gelince renk alan resimlerin bulunduğu gibi bir script arıyorum. Bana yardımcı olursanız sevinirim.

KIVANCEFE · 28 Mart 2011

http://www.htmlite.com/JS019.php bu linkteki kodlar ile yapabilirsin iki resim yapacaksın ikiside aynı olacak ama renkleri farklı olacak biri canlı renkler diğeri ise renk pasif olack

Oğuz · 28 Mart 2011

KIVANCEFE' Alıntı:
http://www.htmlite.com/JS019.php bu linkteki kodlar ile yapabilirsin iki resim yapacaksın ikiside aynı olacak ama renkleri farklı olacak biri canlı renkler diğeri ise renk pasif olack

binevi rollever image olacak yani

alltiger · 28 Mart 2011

Biri renkli diğeri renksiz iki resim olayını denedim. Fakat resimlerin üzerine gelince renkli resmin yüklenmesi çok sürüyor. Ama o sitede üzerine gelince hemen renkleniyor. Adam iki resim kullanmamış filtre gibi bişey yapmış. Filter:Gray; stil tanımlamasını da denedim fakat Firefox ta çalışmadı. Bana onun gibi bir javascript kodu gerekiyor.

@Oğuz image rollever olayı nedir ? Nasıl çalışır ?

kalenderm · 28 Mart 2011

sana demo adresi veriyorum gir kodları incele
http://kurucavusoglu.com/demo3/index.html

ayrıca css ve indexi veriyorum şimdi kodları bi dene

style.css

PHP:

/*Template: Calliope
  Author: Towfiq I.
  website: www.towfiqi.com
*/

body {margin: 0px;padding: 0px;border: 0px;font-family:Arial, Helvetica, sans-serif;background:#E6E6E6;color:#666;}

/*Fonts*/
a { font-size:12px; color:#666;}
a:link{color:#999999; text-decoration:none;}
a:visited{color:#999999; text-decoration:none;}
h1 { font-size:20px; font-weight:bold; color:#333;}
h2 { font-size:24px; font-weight:bold; color:#222; margin:0px;}
h3 {font-size:14px; font-weight:bold; color:#333;}
/*Fonts END*/

#header {background:#222222;height:100px;border-bottom:solid 1px #333333;}

#toprow {height:372px;border-top:solid 1px #1d1d1d;background: #FFFFFF url(images/bg.gif) repeat-x;}
#toprowsub {height:70px;border-bottom:solid 1px #ccc;background: #FFFFFF url(images/bg2.gif) repeat-x;}
#toprowsub h2{padding:15px 30px;}
#midrow {width:960px;margin:0 auto;}
#bottomrow {width:960px;margin:0 auto;}

/*LOGO*/
#logo{padding-top:25px;width:207px;float:left;}
#logo a{background:url(images/logo.jpg) no-repeat;display:block;width:207px;height:53px;text-indent:-10000px;}
/*LOGO END*/

/*Menu Begin*/
#menu{float:right;margin-top:30px;}
#menu ul li{ display:inline; list-style-type:none;}
#menu ul li a{padding:5px 0px; font-size:14px; text-decoration:none; margin:0px 10px; font-weight:bold;}
#menu ul li a span{font-size:14px; text-decoration:none; padding:0px 10px; color:#999999;}
#menu ul li a.active{background:url(images/menur.gif) no-repeat right;}
#menu ul li a.active span{background:url(images/menul.gif) no-repeat left; padding:5px 10px;color:#333;}
#menu ul li a:hover{background:url(images/menur.gif) no-repeat right; font-weight:bold;}
#menu ul li a:hover span{background:url(images/menul.gif) no-repeat left; padding:5px 10px;color:#333;}
/*Menu End*/

.center{width:960px;margin:0 auto;}

/*SlideShow Begin*/
#cu3er-container {margin-top:60px;padding-left:0px;padding-right:0px;width:960px;}
#cubershadow{width:960px;height:372px;background:url(images/shadow.jpg) no-repeat bottom;}
/*SlideShow End*/

/*Homepage Boxs*/
#container {float:left;}
.box {margin-top:20px;padding-top:10px;width:310px;height:auto;float:left;background:url(images/border.jpg) no-repeat bottom right;}
.box h1{padding-left:10px;}
.box p {margin:0px;width:200px;padding:15px 5px 10px 5px;float:left;}
.last{background:none;}

a.plan{float:left;display:block;width:83px;height:101px;background:url(images/plan.jpg) no-repeat 0px -101px;text-indent:-1000px;}
a.plan:hover{ background-position: 0px 1px;}
a.whyus{margin-top:10px;float:left;display:block;width:83px;height:87px;background:url(images/whyus.jpg) no-repeat 0px 0px;text-indent:-1000px;}
a.whyus:hover{ background-position: 0px -88px;}
a.support{margin-top:14px;float:left;display:block;width:83px;height:72px;background:url(images/support.jpg) no-repeat 0px 0px;text-indent:-1000px;}
a.support:hover{ background-position: 0px -70px;}

a.button{background:url(images/buttonr.gif) no-repeat right; padding:3px 0px; margin-left:2px; color:#CCCCCC; text-decoration:none; }
.button span{background:url(images/buttonl.gif) no-repeat left; padding:3px 5px;}
/*Homepage Boxs END*/

/*Subpage Boxs*/
#box2holder{padding: 20px 30px;}
.box2{width:450px; float:left; padding:20px 0px;}
.box2 img{ border: solid 5px #F2F2F2; float:left;}
.box2 h3{margin:0px; padding:0px 5px; float:left;}
.box2 p{width:220px; float:left;padding:5px 5px; margin:0px;}
/*Subpage Boxs END*/


/*Footer*/
#footer {background:#222222;float:left;width:100%;height:50px;border-top:solid 1px #333333;}
.foot{width:960px;margin:0 auto; padding:10px 0px; font-size:12px;}
.foot a:link{color:#999;text-decoration:none;}
/*Footer END*/


.textbox{float:left;padding:50px 0px;width:700px;}
.textbox2{padding:10px 30px; background:url(images/textbox2bg.gif) repeat-x;}
.feed{width:auto; float:left;}
.feed img{ border: solid 0px; margin-top:120px; padding:0px 7px;}

index.html

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">
<head>
<title>Siyah Görsel Show</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-4" />
<link rel="shortcut icon" href="http://forum.iyinet.com/images/favicon.jpg" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="js/swfobject/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
flashvars.xml = "config.xml";
flashvars.font = "font.swf";
var attributes = {};
attributes.wmode = "transparent";
attributes.id = "slider";
swfobject.embedSWF("cu3er.swf", "cu3er-container", "960", "270", "9", "expressInstall.swf", flashvars, attributes);
</script>
</head>
<body>
<!--Header Begin-->
<div id="header">
  <div class="center">
    <div id="logo"><a href="#">Calliope</a></div>
    <!--Menu Begin-->
    <div id="menu">
      <ul>
        <li><a class="active" href="index.html"><span>Ana Sayfa</span></a></li>
        <li><a href="hakkinda.html"><span>Hakkında</span></a></li>
        <li><a href="#"><span>Personel</span></a></li>
        <li><a href="#"><span>İletişim</span></a></li>
      </ul>
    </div>
    <!--Menu END-->
  </div>
</div>
<!--Header END-->
<!--Toprow Begin-->
<div id="toprow">
  <div class="center">
    <div id="cubershadow">
      <div id="cu3er-container"> <a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="" /> </a> </div>
    </div>
  </div>
</div>
<!--Toprow END-->
<!--MiddleRow Begin-->
<div id="midrow">
  <div id="container">
    <div class="box">
      <h1>Eczane Hakkında</h1>
      <a class="plan" href="#">Eczane Hakkında</a>
      <p><a>Eczane hakkında genel bilgiler bu kısımda yer alacaktır kac yılında kuruldu işyeri sahibi kimdir vs.</a><br />
        <br />
        <a href="#" class="button"><span>Devamına Bak</span></a></p>
    </div>
    <div class="box">
      <h1>Personel</h1>
      <a class="whyus" href="#">Personel</a>
      <p><a>İşyerinde çalışan personeller bu alanda yer alacaktır isimleri resimleri veya gerekli bilgileri</a><br />
        <br />
        <a href="#" class="button"><span>Devamına Bak</span></a></p>
    </div>
    <div class="box last">
      <h1>İletişim</h1>
      <a class="support" href="#">İletişim</a>
      <p><a>bu alanda işletme iletişim bilgileri yer alacktır telefon e-mail vs.</a><br />
        <br />
        <a href="#" class="button"><span>Devamını Bak</span></a></p>
    </div>
  </div>
</div>
<!--MiddleRow END-->
<!--BottomRow Begin-->
<div id="bottomrow">
  <div class="textbox">
    <h1>Gerekli görülen bilgiler bu alanda yer alabilir</h1>
    <a>istenilen herhangi bir bilgi bu alana eklenebilir.</a> </div>
  <div class="feed"> <a href="#"><img alt="" src="http://forum.iyinet.com/images/twitter.jpg" height="80" width="75" /></a> <a href="#"><img alt="" src="http://forum.iyinet.com/images/facebook.png" height="70" width="70" /></a> </div>
</div>
<!--BottomRow END-->
<!--Footer Begin-->
<div id="footer">
  <div class="foot"> <span>Dizayn</span> by <a href="#">Kalender Meshrep</a> Tüm haklari<a href="#">siteadi.com</a>'a Aittir. </div>
</div>
<!--Footer END-->
</body>
</html>

bak resimler bu şekilde eklenmiş buna dikkat et.

edit

he bu arada sölemeyi unutmusum kodlarda seni ilgilendirem kısım plan tagı tamam kolay gelsin
dene artık umarım olumlu bi sonuc alırsın

KIVANCEFE · 28 Mart 2011

Oğuz' Alıntı:
binevi rollever image olacak yani

aynen öyle hocam

alltiger · 28 Mart 2011

Hay Allah razı olsun @kalenderm. Image renklendirmeyi hallettik. Sıra şimdi bunu kaydırmada. Onu da marque ile hallederim.

Hepinize teşekkür ediyorum.

kalenderm · 28 Mart 2011

sorun değil hocam bizde birşey sorduk mu sağolsun cevapsız bırakmıyorlar

Slide bandı

alltiger

0

KIVANCEFE

0

Oğuz

2

alltiger

0

kalenderm

0

KIVANCEFE

0

alltiger

0

kalenderm

0

Çevrimiçi üyeler

Botlar