Hey, so i have 4 Divs around a Circle, and when you hover, that content is displayed inside of the circle.
This is what i have working.
Is there a simpler way of doing this ? Or would this be proper ?
Code:
<script type="text/javascript">
$(document).ready(function(){
$(".ss1").hover(function()
{
$(".sc2").css("display", "block");
$(".sc").css("display", "none");
}, function()
{
$(".sc2").css("display", "none");
$(".sc").css("display", "block");
});
$(".ss2").hover(function()
{
$(".sc3").css("display", "block");
$(".sc").css("display", "none");
}, function()
{
$(".sc3").css("display", "none");
$(".sc").css("display", "block");
});
$(".ss3").hover(function()
{
$(".sc1").css("display", "block");
$(".sc").css("display", "none");
}, function()
{
$(".sc1").css("display", "none");
$(".sc").css("display", "block");
});
$(".ss4").hover(function()
{
$(".sc4").css("display", "block");
$(".sc").css("display", "none");
}, function()
{
$(".sc4").css("display", "none");
$(".sc").css("display", "block");
});
});
</script>
Like is tehre any way to not have to copy and paste that code a bunch of times. Some sort of array or something.