Results 1 to 4 of 4

Thread: Featured Image Zoomer v2.1: scroll/follow sidebar assigned to zoom/magnifer area?

  1. #1
    Join Date
    Apr 2013
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Featured Image Zoomer v2.1: scroll/follow sidebar assigned to zoom/magnifer area?

    1) Script Title: Featured Image Zoomer (now w/Multi-Zoom) v2.1

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...uredzoomer.htm

    3) Describe problem: Wanting scroll/follow sidebar assigned to zoom/magnifer area. Using Demo 4 and all is working but my images are really tall and I want the zoom/magnifer area to scroll down the page. How could I do that with CSS or Jquery? Not sure how to tweak this code on DD.
    http://css-tricks.com/scrollfollow-sidebar/

    Here is my page:http://www.paintedpeace.com/gallery/wall-planks/
    If you click on a thumbnail and go to zoom on the bottom of the long piece of art the magnify area stays at top of page and not visible.

    thanks.

  2. #2
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,815
    Thanks
    2
    Thanked 425 Times in 419 Posts

    Default

    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,133
    Thanks
    44
    Thanked 3,229 Times in 3,190 Posts
    Blog Entries
    12

    Default

    Using a text only editor like NotePad, in the multizoom.css file, near the top, add the highlighted as shown:

    Code:
    .magnifyarea { /* CSS to add shadow to magnified image. Optional */
    	box-shadow: 5px 5px 7px #818181;
    	-webkit-box-shadow: 5px 5px 7px #818181;
    	-moz-box-shadow: 5px 5px 7px #818181;
    	filter: progid:DXImageTransform.Microsoft.dropShadow(color=#818181, offX=5, offY=5, positive=true);
    	background: white;
    	position: fixed !important;
    	top: 350px !important;
    }
    Requires IE 7 or later, or any other modern browser.

    You may or may not want to adjust the top coordinate. Just keep in mind that some user's windows will not be as tall as others, and you don't want the magnify area to be so far down in the window that it cannot be fully seen, or perhaps not even be seen at all.

    jQuery could be used to set the top coordinate at half the user's window height minus half the height of the magnify area. It would have to update on window resize as well. If you're interested in that, let me know.

    Also keep in mind that if you set variable zoom, or the mouse wheel disabled options, it will be difficult for the user to scroll the page while viewing the magnified image.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  4. The Following User Says Thank You to jscheuer1 For This Useful Post:

    ottomek (04-22-2013)

  5. #4
    Join Date
    Apr 2013
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Jscheuer1,

    Thank that did the trick. I appreciate your post.

Similar Threads

  1. Featured Image Zoomer (now w/Multi-Zoom) v2.2
    By jscheuer1 in forum Submit a DHTML or CSS code
    Replies: 1
    Last Post: 04-18-2013, 06:38 PM
  2. Replies: 5
    Last Post: 12-06-2012, 01:46 AM
  3. Replies: 1
    Last Post: 01-24-2012, 11:02 AM
  4. Disable zoom in Image Power Zoomer
    By Frank Drebin in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 04-09-2011, 06:28 PM
  5. Simple Image Panner and Zoomer - move the zoom icons?
    By chris_bcn in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 05-05-2010, 08:44 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •