ज़ूम

Question

के साथ jQuery लाइटबॉक्स क्या कोई jQuery स्क्रिप्ट या प्लगइन है जो लाइटबॉक्स में छवियों को खोलता है और आपको लाइटबॉक्स में आगे ज़ूम करने की अनुमति देता है? मुझे स्क्रिप्ट्स की पूरी तरह से पता चला है जो या तो, या इसके कुछ संस्करण हैं, लेकिन कोई भी ऐसा नहीं लगता है। एकमात्र विकल्प पैकेज मैंने पाया कि जो कुछ मैं चाहता था वह अजेक्स-ज़ूम था, लेकिन यह इतनी सरल चीज़ के लिए एक बड़ा जानवर है। उल्लेख नहीं है, मेरा साझा सर्वर इसे थोड़ा पसंद नहीं करता है।

Answer 1

मैं एक ही समस्या आ रही है और केवल ajax-zoom.com

http://www.ajax-zoom.com/examples/example5.php

यह हम क्या चाहते हैं करता है के साथ आए हैं, लेकिन यह नहीं बल्कि भद्दा है। मैं Concrete5 उपयोग कर रहा हूँ और वहाँ एक ऐड-ऑन बुलाया jqZoom छवि जो ज़ूम पर एक अच्छा सरल मंडराना है

http://www.concrete5.org/marketplace/addons/jqzoom-image/

c5extras.com/add-ons/jqzoom

आदर्श रूप में मैं एम्बेड करना चाहते हैं यह एक मानक, सरल, साफ लाइटबॉक्स शैली पॉप-अप में है। मैंने सी 5 समुदाय से यह देखने के लिए कहा है कि कोई ऐसा करने के लिए तैयार है क्योंकि मेरे पास आवश्यक कौशल नहीं है। अगर मैं कहीं भी जाऊं तो मैं यहां पोस्ट करूंगा।

क्या आप अपनी खोज के साथ कहीं भी गए थे?

Answer 2

बस किसी को भी समाधान नहीं मिला, तो यह करने का एक तरीका है। आपको लाइटबॉक्स और एलिवेटज़ूम के बजाय फैंक्सबॉक्स का उपयोग करने की आवश्यकता होगी। आप उन्हें निम्न लिंक पर पा सकते हैं:

http://fancyapps.com/fancybox/#license

http://www.elevateweb.co.uk/image-zoom/download

बार जब आप इस डाउनलोड किया है, विभिन्न प्लग इन शीर्षक में (या एक तेजी से लोड करने के लिए शरीर के निचले भाग में) जोड़ने के लिए, अपने हेडर कुछ इस तरह दिखना चाहिए:

<link rel="stylesheet" type="text/css" href="css/jquery.fancybox.css" /> 
    <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> 
    <script type="text/javascript" src="js/jquery.fancybox.pack.js"></script> 
    <script type="text/javascript" src="js/jquery.elevateZoom-3.0.8.min.js"></script> 

बस jquery.fancybox के बाद, जोड़ने निम्नलिखित:

<style type="text/css"> 
    .zoomContainer { z-index: 100000; } 
</style> 

यह एक फिक्स है इसलिए ज़ूम कंटेनर वास्तविक फैंक्सबॉक्स से ऊपर दिखाई देता है।

अपनी छवियों को लपेटने वाले लिंक पर .fancybox कक्षा जोड़ें।

फिर विभिन्न लिपियों के बाद निम्नलिखित जोड़ें:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".fancybox").fancybox({ 
     afterShow: function() { 
      $('.fancybox-image').elevateZoom({ 
      zoomType : "lens", 
      lensShape : "round", 
      lensSize : 200 
      }); 
     } 
     }); 
    }); 
    </script> 

फिर आप lense fancybox के साथ काम करना चाहिए था!