Lütfen kurtarın beni bu css karmaşasından :(

11-03-2009, 00:12:13

Merhaba arkadaşlar kullandığım scriptin yazarlarını aşağıda resmdeki gibi düzenlemek istiyorum yaklaşık bir haftadır uğraşıyorum ama işin içinden çıkamadım son çare olarak r10.net teki üstatlarımdan yardım istemekte buldum lütfen yardım edin...

<html>
<head>
<title>Yazarlar</title>
<script src="js/function.js" type="text/javascript"></script>
<style type="text/css">
<!--
/* HTML STYLE
--------------------------------------------------------- */
html, body, form, fieldset {
	margin: 0;
	padding: 0;
}
body {
	background: #FFFFFF;
	color: #ffffff;
	font-family: Tahoma ,Arial, Helvetica, sans-serif;
	line-height: 1.5;
}
/* YAZARLAR */
#yazaradi {
	position:absolute;
	left:1px;
	top:159px;
	width:150px;
	height:24px;
	z-index:1;
	top: 152px;
}
#yazar_spot {
	position:absolute;
	left:4px;
	top:185px;
	width:146px;
	height:130px;
	z-index:2;
}
.right_caption2 span{
	padding-left: 10px;
}
.main_author .container{
	width: 126px;
	height: 126px;
}
.main_author .article_content{
	margin-left: 6px;
	margin-top: 10px;
	width: 142px;
	overflow: hidden;
	text-align: center;
}
.main_author .author_article_name_0{
	margin-left: 300px;
	margin-top: 42px;
	width: 10px;
	overflow: hidden;
	text-align: center;
	color: #FFFFFF;
	font-weight: bold;
}
.main_author .article_content img {
	width: 126px;
	height: 126px;
	margin-top: 28px;

	vertical-align: middle;
}
.main_author .article_content .title {
	height: 20px;
	overflow: hidden;
	padding-top: 10px;
}
.main_author .article_content .title a{
	color: #ffffff;
	font: 100 8pt/15px Verdana;
}
.main_author .items{
	margin-left: 153px;
	margin-top: -130px;
	width: 145px;
}
.main_author .item span{
	padding-left: 5px
}
.main_author .item {
	height: 20px;
	font: 100 8pt/19px Verdana;
	overflow: hidden;
	border-bottom: 1px solid #FFFFFF;
}
.main_author .item a{
	color: #FFFFFF;
	padding-left: 3px;
	text-decoration: none;
	font-weight: bold;
}
.item a{
	color: #FFFFFF;
	padding-left: 3px;
	text-decoration: none;
	font-weight: bold;
}
#resim {
	position:absolute;
	left:14px;
	top:29px;
	width:126px;
	height:126px;
	z-index:3;
}
#yazar_alani {
	position:absolute;
	left:195px;
	top:28px;
	width:300px;
	height:316px;
	z-index:4;
	background-image: url(http://img22.imageshack.us/img22/3739/authorbck.png);
}
#author {
	position:absolute;
	left:351px;
	top:61px;
	width:144px;
	height:24px;
	z-index:5;
}

-->
</style>
</head>
<body>

<?
//session_start();
include "ayar.php";

?>






<div id="yazar_alani">
<div id="resim">
<div class="article_content"><img id="author_img_0" src="images/1x1.gif" align="left" alt=""/></div></div>
<div id="yazaradi">
  <div align="center"><div id="author_article_name_0"></div></div>
</div>
<div id="yazar_spot">
  <div align="left"><div id="author_article_title_0"></div></div>
</div>


</div>

<span class="main_author">
<?
                          $query2 = "SELECT * FROM users WHERE status = 5";
                          $result2 = mysql_query ($query2) or die ("error");
                          while ($line2 = mysql_fetch_array($result2)){
                          $picture = $line2[picture1];
                          $author_name = $line2[name];
						  //$numara = $line2[a_articles.id];
						  //$konu = $line2[a_articles.subject];
                          //}
                          ?>
<?
                          $query3 = "SELECT * FROM a_articles where sender = ". $line2[id] ."";
                          $result3 = mysql_query ($query3) or die ("error");
                          while ($line3 = mysql_fetch_array($result3)){	
?>
</span>

<script type="text/javascript">
function authorChange(author_type, author_id, author_name, article_id, article_link, _title, _spot)
{
	document.getElementById("author_img_" + author_type).src = '' + author_id;
	document.getElementById("author_article_name_" + author_type).innerHTML = '<a style="color: #000000; font: bold 8pt/15px Tahoma;" href="' + article_link + '">' + author_name + "</a>";
	document.getElementById("author_article_title_" + author_type).innerHTML = '<a style="color: #000000;font: 100 8pt/15px Tahoma;" href="' + article_link + '">' + _title + "</a>";
}
function authorSelectChanged(authorId)
{
	if(authorId != "")
		window.location = "a_article_view.php?idx=<?=$line3[id];?>";
	return false;
}

  </script>
<div class="container">




  
<div id="author">
<div class="items">
<!--Yazarlar BaÅŸlÄ±yor-->
  <span class="item"><a class=yazar href="a_article_view.php?idx=<?=$line3[id];?>" onMouseOver="return authorChange('0','/pictures/authors/<?=$picture;?>', '<?=$author_name;?>', '477', 'a_article_view.php?idx=<?=$line3[id];?>', '<?=$line3[subject];?>');">
<?=$author_name;?>
</a>

</span>
</div>

</div>  






  </div>
 </div>
<?
}
?> 
<!--Yazarlar Bitti-->
<script type="text/javascript">	authorChange('0','/pictures/authors/<?=$picture;?>', '<?=$author_name;?>', '477', 'a_article_view.php?idx=<?=$line3[id];?>', 'Davosta Kriz Yarat...');	</script>	</script>
    </div>
  </div>
</div>

<span class="container">
<?
}
?>
</span>
</body>
</html>

Buda function.js kodu

function changeNewsDetail(idx)
{
	if(previousItem != -1)
	{
		document.getElementById("news_headline_" + previousItem).style.display = 'none';
	}
	document.getElementById("news_headline_" + idx).style.display = 'block';
	
	document.getElementById("news_image").src = './pictures/' + imageArr[idx] + '.jpg';
	document.getElementById("news_spot").innerHTML = "<a href=\"article_view.php?id=" + idArr[idx] + "\">" + spotArr[idx] + "</a>";
	document.getElementById("news_link").href = "news_detail.php?id=" + idArr[idx];
	
	previousItem = idx;
	return false;
}
function authorChange(author_id, author_name, article_id, _title)
{
	document.getElementById("author_img").src = './pictures/authors/' + author_id + "";
	document.getElementById("author_article_name").innerHTML = author_name;
	document.getElementById("author_article_title").innerHTML = '<a href="a_article_view.php?idx=' + article_id + '">' + _title + "</a>";
}
function changeMostlyTab(idx)
{
	if(idx == 1)
	{
		document.getElementById("mostly_readed").style.display = 'block';
		document.getElementById("mostly_commented").style.display = 'none';
	}
	else
	{
		document.getElementById("mostly_readed").style.display = 'none';
		document.getElementById("mostly_commented").style.display = 'block';
	}
}
function changeMostlyTab2(idx)
{
	if(idx == 2)
	{
		document.getElementById("mostly_readed2").style.display = 'block';
		document.getElementById("mostly_commented2").style.display = 'none';
	}
	else
	{
		document.getElementById("mostly_readed2").style.display = 'none';
		document.getElementById("mostly_commented2").style.display = 'block';
	}
}
function changeMostlyTab3(idx)
{
	if(idx == 2)
	{
		document.getElementById("mostly_readed3").style.display = 'block';
		document.getElementById("mostly_commented3").style.display = 'none';
	}
	else
	{
		document.getElementById("mostly_readed3").style.display = 'none';
		document.getElementById("mostly_commented3").style.display = 'block';
	}
}
function changeTarget(elm)
{
	tmp = elm.getElementsByTagName("a");
	for(i=0; i<tmp.length; i++)
		tmp[i].target = "_blank";
}
function changeSize(elm, _size, class_name)
{
	document.getElementById(elm).className = class_name + ' ' + class_name + '_' + _size;
	Set_Cookie('text_size', _size, 30, '', '', '');
}
function drawTopMenu(menuitem, active_page)
{
	i = 0;
	str = '';
	sep_class = "sep";
	item_class = "item";
	for (i=0; i < 6; i++)
	{
		if(active_page == i)
		{
			sep_class = "active_sep_1";
			item_class = "active_item";
		}
		
		if(i == 0 && sep_class != "active_sep_1")
			str += '<div class="sep_first"></div>';
		
		if( !(i == 0 && sep_class == "sep"))
			str += '<div class="' + sep_class + '"></div>';
		
		str += '<div class="' + item_class + '"><a href="javascript:void()" onclick="changeHeadlineTab(' + i + ')">' + menuitem[i] + '</a></div>';
		
		if( i == 5 && sep_class == "active_sep_1" )
			str += '<div class="active_sep_2"></div>';
		
		if(active_page == i)
			sep_class = "active_sep_2";
		else
			sep_class = "sep";
		
		item_class = "item";
	}
	document.write(str);
	str = null;
	i = null;
	sep_class = null;
	item_class = null;
}
function SymError()
{
	return true;
}

11-03-2009, 11:11:17

#2

~~sdemirkeser~~

Üyeliği durduruldu

neresinde takıldınız?

11-03-2009, 12:55:37

#3

medesan

ustam aşağıdaki resimdeki gibi yapmak istiyorum ama tüm yazarlar üst üste geliyor

11-03-2009, 13:13:10

#4

sayiton

önce iki dosyanın yedeğini alıp function.js Dosyasında

bu satırı

Alıntı

str += '<div class="' + item_class + '"><a href="javascript:void()" onclick="changeHeadlineTab(' + i + ')">' + menuitem[i] + '</a></div>';

bu şekilde değiştirip

Alıntı

str += '<div class="' + item_class + '"><a href="javascript:void()" onclick="changeHeadlineTab(' + i + ')" class="syt">' + menuitem[i] + '</a></div>';

CSS bölümüne de

Alıntı

a.syt{position:relative; display:block;}

ekleyerek deneyebilirmisin ?

11-03-2009, 13:34:19

#5

medesan

Malefaf hocam bi değişiklik olmadı

sayiton adlı üyeden alıntı: mesajı görüntüle

önce iki dosyanın yedeğini alıp function.js Dosyasında
bu satırı
bu şekilde değiştirip
CSS bölümüne de
ekleyerek deneyebilirmisin ?

11-03-2009, 14:09:21

#6

sayiton

ben problemi yanlış anlamışım zaten tam olarak nasıl bi hata verdiğini görebilseydim daha doğru yardımcı olabilirim sanırım

11-03-2009, 14:15:33

#7

medesan

Aldığım hata tam olarak işte bu... yuazar isimleri üst üste geliyor

sayiton adlı üyeden alıntı: mesajı görüntüle

ben problemi yanlış anlamışım zaten tam olarak nasıl bi hata verdiğini görebilseydim daha doğru yardımcı olabilirim sanırım

11-03-2009, 14:46:14

#8

sayiton

.item a{
color: #FFFFFF;
padding-left: 3px;
text-decoration: none;
font-weight: bold;
display:block;
position:relative;
}

o bölüme kırmızı kodları eklermisin

11-03-2009, 14:53:15

#9

medesan

mahlesef yemedi

sayiton adlı üyeden alıntı: mesajı görüntüle

.item a{
color: #FFFFFF;
padding-left: 3px;
text-decoration: none;
font-weight: bold;
display:block;
position:relative;
}
o bölüme kırmızı kodları eklermisin