DIV größe wird im JQuery Dialog gar nicht beachtet


BlubBlub

Mitglied
HTML:
	<body>
		<div id="myDialog" style="width:610px; height:300px; background-color:cyan;">
			testblock
		</div>
			
		<script type ="text/javascript">
			$(document).ready(function(){		
				$('#myDialog').dialog({
					title: 'Titel',
					position: ['right','top'],
					resizable: false,
					width: 910,
					height: 600
				});
			});
		</script>
	</body>

Hi kann mir jemand helfen und sagen wieso meine angegebene Div größe überhaupt nicht beachtet wird?
Im JQuery Dialog wird das komplette Fenster ausgefüllt, dabei müsste aber im JQuery Dialog nur ein Quadrat mit den Maßen width:610px; height:300px zu sehen sein.
 

Drawlix

Mitglied
Also dies funktioniert kann es sein das du nicht alle scripte eingebunden hast
HTML:
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  
</head>
<body style="font-size:62.5%;">
  
<body>
		<div id="myDialog" style="width:610px; height:300px; background-color:cyan;">
			testblock
		</div>
			
		<script type ="text/javascript">
			$(document).ready(function(){		
				$('#myDialog').dialog({
					title: 'Titel',
					position: ['right','top'],
					resizable: false,
					width: 50,
					height: 50
				});
			});
		</script>

</body>
</html>

gruß drawlix
 

BlubBlub

Mitglied
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  
</head>
<body style="font-size:62.5%;">
  
<body>
		<div id="myDialog" style="width:610px; height:300px; background-color:cyan;">
			testblock
		</div>
			
		<script type ="text/javascript">
			$(document).ready(function(){		
				$('#myDialog').dialog({
					title: 'Titel',
					position: ['right','top'],
					resizable: false,
					width: 910,
					height: 600

				});
			});
		</script>

</body>
</html>

du hast in der dialog funktion die falschen widht und height werte eingegeben, wenn du meine nimmst width:910 und height:600 dann funktioniert das weiterhin nicht. das dialogfeld wird komplett gefüllt anstelle nur eines ausschnittes.
 

Drawlix

Mitglied
mhhh ich verstehe gerade nicht so die frage meinst du das nur width:610px; height:300px color:cyan beinhalten soll
und das überschüssige weiß
 

Quaese

Moderator
Moderator
Hi,

versuch mal, die Dimensionen zusätzlich mit important auszuzeichnen:
Code:
<div id="myDialog" style="width:610px !important; height:300px !important; background-color:cyan;">
Desweiteren möchte ich euch bitten, auf Gross- und Kleinschreibung zu achten - besten Dank im Voraus.

Ciao
Quaese
 

Drawlix

Mitglied
. das dialogfeld wird komplett gefüllt anstelle nur eines ausschnittes.
Nun ich verstehe das nun so.Nämlich das du einen Ausschnitt von einer Dimension mit den Maßen (width:610px height:300px) farbig haben willst dies ,aber bei einer Gesamtgröße von 910* 600 px . In diesem Fall würde ich ein würde ich ein zusätzliches div einfügen bit der Dimension die farbig werden soll
hoffe nun das es so von dir gemeint war :confused:

gruß
 

BlubBlub

Mitglied
versuch mal, die Dimensionen zusätzlich mit important auszuzeichnen:
Code:
<div id="myDialog" style="width:610px !important; height:300px !important; background-color:cyan;">


Also das mit dem Important hab ich auch bereits versucht mit dem Ergebnis, dass es im Internetexplorer keine Wirkung zeigt und im Firefox die Breite zwar richtig angezeigt wird die Höhe aber nicht. Die Höhe wird im Firefox, an die Höhe angepasst die im Dialog angegeben ist.

@Drawlix: Du hast richtig verstanden was ich meine. Aber gerade versteh ich deinen Lösungsvorschlag noch nicht ganz.
 

Drawlix

Mitglied
so meine ich das
HTML:
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  
</head>
<body style="font-size:62.5%;">
  
<body>
		<div id="myDialog">
		 <div id="myDialog2" style="width:100px; height:300px; background-color:cyan;">
			testblock
		</div>
		</div>
			
		<script type ="text/javascript">
			$(document).ready(function(){		
				$('#myDialog').dialog({
					title: 'Titel',
					position: ['right','top'],
					resizable: false,
					width: 910,
					height: 600

				});
			});
		</script>

</body>
</html>
 

Neue Beiträge

Forum-Statistiken

Themen
272.360
Beiträge
1.558.622
Mitglieder
187.833
Neuestes Mitglied
SirrDansen