0

I saw this fish eye effect rendering js and tried to use it in a site HTML.It works fine but i am unable to change the space between the items. Does anybody know how to change the space between the items? This is the Html/js code :

<script type="text/javascript">

    $(document).ready(
        function()
        {
            $('#dock').Fisheye(
                {
                    maxWidth: 50,
                    items: 'a',
                    itemsText: 'span',
                    container: '.dock-container',
                    itemWidth: 75,
                    proximity: 90,
                    halign : 'center'
                }
            )
        }
    );

</script><div id="topbutton-container">
<div style="float:left; width:17px; margin:0px;"><img src="images/topbutton-left.jpg" /></div>
<div id="topbutton" align="center"><div class="dock" id="dock">
  <div class="dock-container">
  <a class="dock-item" href="index.html"><img src="images/home.png" alt="home" /><span>Home</span></a> 
  <a class="dock-item" href="projects.html"><img src="images/projects.png" alt="contact" /><span>Projects</span></a> 
  <a class="dock-item" href="course.html"><img src="images/course.png" alt="portfolio" /><span>Course</span></a> 
  <a class="dock-item" href="testimonial.html"><img src="images/music.png" alt="music" /><span>Testimonial</span></a> 
  <a class="dock-item" href="latest-updates.html"><img src="images/history.png" alt="history" /><span> Latest Updates</span></a> 
  <a class="dock-item" href="contact.html"><img src="images/contact.png" alt="calendar" /><span>Contact</span></a> 
</div>
</div></div>
<div style="float:left; width:17px; margin-top:0px;"><img src="images/tobutton-right.jpg" /></div>
</div>
5
  • .dock-item{margin: 0 30px;}
    – Riz
    Oct 18, 2012 at 11:35
  • @Dev Not working, only affecting the last div/anchor(i.e contacts) Oct 18, 2012 at 11:44
  • Wish I can see that in fiddle.
    – Riz
    Oct 18, 2012 at 12:05
  • can you create demo on jsfiddle.net
    – Riz
    Oct 18, 2012 at 12:09
  • @Dev Ok..I'll do it within two hours. Right now in office. Oct 18, 2012 at 12:45

1 Answer 1

0

do you included all the supporting files?

    <script type="text/javascript" src="javascript/jquery.js"></script>
    <script type="text/javascript" src="javascript/interface.js"></script>
    <link type="text/css" href="css/interface-fisheye.css" rel="stylesheet"> 
1
  • yes i did.Changing the margin values( and other style values of dock items) is only affecting the last div/anchor(i.e contacts). Oct 18, 2012 at 11:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.