HTML - JQuery I think

[kkelly]

Hi guys

I am currently doing a wee Web Authoring module and in the process of creating my website using dreamweaver .

I have any idea about putting links in one of my 'div' boxes on the page and content to change in the other 'div' box when the mouse goes over them.

From my google searches I have discovered 'jquery' is this the correct thing to do this? Or is there a eaiser build in method in dreamweaver?

Thanks

 

[Bes]

Jquery can do that. I doubt DreamWeaver can.

 

[suarve]

I'm sure there be a bloated dreamweaver plugin that costs £100 that can do that but you can do it very simply with a bit of Javascript.

Using JQuery it's as simple as:

$('#myDiv').show();
$('#myDiv').hide();

To toggle your content (single link acts as a show/hide button) with a nice animation you could try:

$('#myDiv').toggle('slow');

If you've got multiple divs with different content you could try giving using JQuery's next() function (although I'm sure there a jquery plugin out there that does all this for you):

$(".myToggle").click(function(){
   $(this).next('div').slideToggle("slow");
});

 

[kkelly]

Thanks guys no doubt I will have more questions shortly

 

[kkelly]

Stuck again guys !

I am trying to display an image in one div box and text in the other, also how do I apply my html formats to the text ?

Thanks Kevin.


<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#changeText").click(function() {
$("#visit_scotland").html("My text is changed!");
$("#stay_scotland").html("My text is changed!");
});
});
$(document).ready(function() {
$("#changeText2").click(function() {
$("#visit_scotland").html("My text is changed2!");
$("#stay_scotland").html(<img src="../ImagesMain Page/flag-of-scotland.jpg" alt="test" /> );
});
});
</script>

 

[Tripnologist]

Unless I'm missing something, this should work fine.

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$('#changeText').click(function() {
			$('#visit_scotland').html('My text is changed!');
			$('#stay_scotland').html('My text is changed!');
		});
		$('#changeText2').click(function() {
			$('#visit_scotland').html('My text is changed2!');
			$('#stay_scotland').html('<img src="../ImagesMain Page/flag-of-scotland.jpg" alt="test" />');
		});
	});
</script>

 

[kkelly]

Thanks Tripnologist I was missing " ' "

 

[Tripnologist]

np