Thursday, May 29, 2014

Working With __doPostBack Jquery Function In The Asp.Net C#

By:LOKESH at Labels: ,
Introduction

In this article we are going to learn the topic of how to post back the dropdown selected change without changing the property of Autopostback=”true” .

For this we are going to call the method at the time of onchange event OnChange="dropDownChange();"

In this method we write the call back method with parameter condition like
__doPostBack('pnlGrid', strUser)

Coding

Write this code

In Aspx Source File

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">


Read More »
Read more »
No comments:

Get The Specific Column From The Data Table Using Asp.Net C#

By:LOKESH at Labels:
Step 1:- Creating the dynamic data table

DataTable dt = new DataTable();
dt.Columns.Add("UserId", typeof(int));
dt.Columns.Add("UserName", typeof(string));
dt.Columns.Add("Education", typeof(string));
dt.Rows.Add(1, "Lokesh", "B.Tech");
dt.Rows.Add(2, "Vijay", "Msc");
dt.Rows.Add(3, "Balaji", "MS");
dt.Rows.Add(4, "Charan", "B.Tech");
dt.Rows.Add(5, "Durga", "MD");
dt.Rows.Add(6, "Shiva", "B.Tech");
dt.Rows.Add(7, "Venkat", "CA");

Step 2:- By using the “DefaultView”  Key word get the specific column from the existing the data table

DataTable dtDistinct = dt.DefaultView.ToTable(true, "UserName");

It will return only the "UserName” Column details


Read More »
No comments:

Get the Specific Row From the Data Table using LINQ in Asp.Net

By:LOKESH at Labels:
Step 1:- Create One dynamic datatable

DataTable dt = new DataTable();
dt.Columns.Add("UserId", typeof(int));
dt.Columns.Add("UserName", typeof(string));
dt.Columns.Add("Education", typeof(string));
dt.Rows.Add(1, "Lokesh", "B.Tech");
dt.Rows.Add(2, "Vijay", "Msc");
dt.Rows.Add(3, "Balaji", "MS");
dt.Rows.Add(4, "Charan", "B.Tech");
dt.Rows.Add(5, "Durga", "MD");
dt.Rows.Add(6, "Shiva", "B.Tech");
dt.Rows.Add(7, "Venkat", "CA");

This is the LINQ code for getting the specific row based on the Userid

var results = (from myRow in dt.AsEnumerable()
where myRow.Field<int>("UserId") == Convert.ToInt16(“1”)
                               select myRow).CopyToDataTable();

GridView1.DataSource = results;
GridView1.DataBind();


Read More »
No comments:

Manipulating the Asp.Net Textbox with Custom Inputs using JQuery

By:LOKESH at Labels: ,
Manipulating the Asp.Net Textbox with Custom Inputs using JQuery

Step 1:- Add this Source tag in the top
<script src="js/jquery-1.4.1.js" type="text/javascript"></script>

For jquery-1.4.1.js  this file follow below link

https://code.google.com/p/autojscssversion/source/browse/trunk/Scripts/jquery-1.4.1.js?r=2
Step 2:- Write this code below

Put Client ID Mode Static in the Top ClientIDMode="Static" %>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TextBoxManipulationUsingJavascript.aspx.cs"
    Inherits="SampleTestingCodes.TextBoxManipulationUsingJavascript" ClientIDMode="Static" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="js/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#TextBox1').keyup(function (e) {
                var message = $("#TextBox1").val();
                var length = message.length;
                if (message.charAt(0) == "A") {
                    if (message.charAt(1) == "A") {
                        for (var i = 2; i < length; i++) {
                            if (message.charAt(i) >= 0 || message.charAt(i) <= 9) { }
                            else
                            { $("#TextBox1").val(message.slice(0, i)); }
                            if (length > 12)
                                $("#TextBox1").val(message.slice(0, 12));
                        }
                    }
                    else { $("#TextBox1").val(message.slice(0, 1)); }
                }
                else { $("#TextBox1").val(''); }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>//////AA0123456789
    </div>
    </form>
</body>
</html>


Output:-

This Code textbox only allows

AA0123456789




For any clarifications or queries please don’t hesitate to call or Email 

Phone :- + 91-9492179390


Email :- lannam@technobrainltd.com (or) lokeshtec@gmail.com 



Read More »
No comments:

Getting the System Local IP address from the ASP.Net Using the ActiveX Control

By:LOKESH at Labels:
Getting the System Local IP address from the ASP.Net Using the ActiveX Control

Step 1:- Creating the one empty windows project c#
Open visual studio à File àNew àProject à In installed templates select the Windows à
And select Class Library àName it as “SampleActiveXControl “ and click ok à

Step 2:-Go to solution explorer à Right click the sampleActiveXControl  project àAdd à
New Item àSelect Windows Forms in the installed template àand select User Control à
And name it as “ActiveXUserControl .cs“   and click add 
àFor Identification change the color of the user control background to blue

Step 3:- Creating the SNK (Strong Name Key) file
For Reference go through this link
http://msdn.microsoft.com/en-us/library/dd788548.aspx

Step 4:- Click Start àAll programs àMicrosoft visual studio 2010 à Visual studio Tools à
Right click the Visual studio Command prompt àRun as Administrator à

Type                      cd<Space>c:\<Enter>
                                sn<Space>-k<Space> ActiveXUserControl.snk<Enter>

SNK file is created with the name of “ActiveXUserControl.snk” in the c: folder


SNK file is look like



Step 5:- Cut that ActiveXUserControl.snk file and past it in to SampleActiveXControl project

Step 6:- Go to ActiveXUserControl.cs user control in the code file write this code for getting the local IP address

using System.Net;


        public string GetLocalIpAddress()
        {
            try
            {
                string strHostName = "";
                strHostName = System.Net.Dns.GetHostName();

                IPHostEntry ipEntry = System.Net.Dns.GetHostEntry(strHostName);

                IPAddress[] addr = ipEntry.AddressList;

                return addr[addr.Length - 1].ToString();
            }
            catch (Exception ex)
            {
                return ex.Message.ToString();
                //MessageBox.Show("Error in IP");
            }

        }

Step 7:- Go to solution explorer àRight click the project à Properties à

In the Application Tab àClick Assembly Information à Assembly Information window

will open àCheck the Make assembly COM-Visible check box à OK








Step 8:- Go to Build tab àIn output Section à

Check the Register for COM interop checkbox





Step 9:-Go to Signing Tab àCheck the Sign the assembly checkbox

And choose a strong name key file



Step 10:-Creating the Windows setup for this project

Right click the solution explorer àAdd àNew project à In the installed templates à

Other project Types àSetup and deployment àVisual studio Installer à

Setup Project Template àName it as à EXESampleActiveX

Go to solution explorer àRight click the EXESampleActiveX project àAdd àProject
OutputàSelect Primary output and click ok àBuild the EXESampleActiveX project


Step 10:- For accessing this ActiveX Control from the we we have to do these steps

Add the Web project to accessing this ActiveX control

Right click the Solution Explorer àAdd à New Project àSelect Asp.net Web Application

Name it as WebApplication1 àOK

Step 11:- Install the project EXESampleActiveX

Step 12:- Open the WebApplication1 project

àGo to Default Master Page

Create the id for the <Form> Tag

<form runat="server" id="SampleForm">

Go to Default.Aspx Page and write the below Code

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <script type="text/javascript">
        function GetIPAdd() {
            var IP = SampleForm.ObjectIP.GetLocalIpAddress();
            alert(IP);
        }
        //HKEY_CLASSES_ROOT\CLSID\{39428ECB-0122-3499-8663-96171159E2C3}
        //HKEY_CLASSES_ROOT\CLSID\{C16564FA-33CF-345D-A12A-E91BAF434A78}
        //HKEY_CLASSES_ROOT\TypeLib\{7112EEA6-FA5B-4AB9-AFFF-DC1F6C21CE0E}
        //HKEY_CURRENT_USER\Software\Classes\CLSID\{39428ECB-0122-3499-8663-96171159E2C3}
        //HKEY_CURRENT_USER\Software\Classes\CLSID\{C16564FA-33CF-345D-A12A-E91BAF434A78}
        //HKEY_CURRENT_USER\Software\Microsoft\Installer\Products\DD22616C4AA9ECA4FA90F970251F6458
    </script>
    <h2>
        Welcome to ASP.NET ActiveX Control Accessing</h2>
    <h3>
        Getting Local Ip Address
    </h3>
    &nbsp; &nbsp;
    <asp:Button ID="Button1" runat="server" Text="Get Local IP" OnClientClick="GetIPAdd();" />
    &nbsp;
    <object id="ObjectIP" type="application/x-oleobject" classid="CLSID:C16564FA-33CF-345D-A12A-E91BAF434A78">
    </object>
</asp:Content>





Step 13:- Find the CLSID for that user control is

classid="CLSID:C16564FA-33CF-345D-A12A-E91BAF434A78">

Step 14:- Steps to find the CLSID in the system

After Install the Setup project

StartàRunà Type àregeditàEnter à Copy the ActiveX control project name “SampleActiveXControl”  find in the registry Edit




Click Find Next à For go to next find Click F3 button

Like that fin all the keys in the registry

and make track like


//HKEY_CLASSES_ROOT\CLSID\{39428ECB-0122-3499-8663-96171159E2C3}
        //HKEY_CLASSES_ROOT\CLSID\{C16564FA-33CF-345D-A12A-E91BAF434A78}
        //HKEY_CLASSES_ROOT\TypeLib\{7112EEA6-FA5B-4AB9-AFFF-DC1F6C21CE0E}
        //HKEY_CURRENT_USER\Software\Classes\CLSID\{39428ECB-0122-3499-8663-96171159E2C3}
        //HKEY_CURRENT_USER\Software\Classes\CLSID\{C16564FA-33CF-345D-A12A-E91BAF434A78}
        //HKEY_CURRENT_USER\Software\Microsoft\Installer\Products\DD22616C4AA9ECA4FA90F970251F6458


And Copy one CLSID and past in the project and  check

1.  <object id="ObjectIP" type="application/x-oleobject" classid="39428ECB-0122-3499-8663-96171159E2C3">
</object>
 Error:-- Out put fails
While running this project u getting error like



Correct Output is


I tried with another CLSID  C16564FA-33CF-345D-A12A-E91BAF434A78

<object id="ObjectIP" type="application/x-oleobject" classid="CLSID:C16564FA-33CF-345D-A12A-E91BAF434A78">
    </object>



Click Local ip button and Check




Actually the code will work from installed in the system but this is the web application loading from the servers

By using this we can access all the local system controls from the ASP.net c#




Important :-

One more important steps

This ActiveX Controls will work only in the IE will not Work in the other browsers

For Firing this activex control we have to change some options in the Internet Explorer(IE)

Go to internet Options



In Security Tab àClick Trusted Site àClick Sites buttons



Type the your URL ip address

My ip is localhost for the reason I  adding httP://localhost

Close

Click Custom Levels




Go to ActiveX Controls and Plug-ins and enable all the radio buttons



Ok


All are working fine any queries please comment here



For any clarifications or queries please don’t hesitate to call or Email 

Phone :- + 91-9492179390


Email :- lannam@technobrainltd.com (or) lokeshtec@gmail.com 


Read More »
No comments:

Wednesday, May 28, 2014

Creating the Zooming the Image while mouse hover Using Jquery like EBye Adverticements sites in Asp.net C#

By:LOKESH at Labels:
Step 1:- Add this line
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="js/jquery.elevatezoom.min.js" type="text/javascript"></script>

To Make jquery.elevatezoom.min.js file Explanation is in the below

Step 2:- Add this Full Code

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="js/jquery.elevatezoom.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#img1").elevateZoom();
        });
    </script>
</head>
<body>
    <div>
<img id="img1" src="Images/Cars/small/image1.png" data-zoom-image="Images/Cars/large/image1.jpg" />
    </div>
</body>
</html>



Steps to Create Js file

Copy Below Code

Open one text file àpast the below codeà and save it as “jquery.elevatezoom.min.js”



/* jQuery elevateZoom 2.5.5 - Demo's and documentation: - www.elevateweb.co.uk/image-zoom - Copyright (c) 2012 Andrew Eades - www.elevateweb.co.uk - Dual licensed under the LGPL licenses. - http://en.wikipedia.org/wiki/MIT_License - http://en.wikipedia.org/wiki/GNU_General_Public_License */
"function"!==typeof Object.create&&(Object.create=function(d){function e(){}e.prototype=d;return new e});
(function(d){var e={init:function(a,b){var c=this;c.elem=b;c.$elem=d(b);c.imageSrc=c.$elem.data("zoom-image")?c.$elem.data("zoom-image"):c.$elem.attr("src");c.options=d.extend({},d.fn.elevateZoom.options,a);c.options.tint&&(c.options.lensColour="none",c.options.lensOpacity="1");"inner"==c.options.zoomType&&(c.options.showLens=!1);c.$elem.parent().removeAttr("title").removeAttr("alt");c.zoomImage=c.imageSrc;c.refresh(1);d("#"+c.options.gallery+" a").click(function(a){c.options.galleryActiveClass&&
(d("#"+c.options.gallery+" a").removeClass(c.options.galleryActiveClass),d(this).addClass(c.options.galleryActiveClass));a.preventDefault();c.zoomImagePre=d(this).data("zoom-image")?d(this).data("zoom-image"):d(this).data("image");c.swaptheimage(d(this).data("image"),c.zoomImagePre);return!1})},refresh:function(a){var b=this;setTimeout(function(){b.fetch(b.imageSrc)},a||b.options.refresh)},fetch:function(a){var b=this,c=new Image;c.onload=function(){b.largeWidth=c.width;b.largeHeight=c.height;b.startZoom();
b.currentImage=b.imageSrc;b.options.onZoomedImageLoaded(b.$elem)};c.src=a},startZoom:function(){var a=this;a.nzWidth=a.$elem.width();a.nzHeight=a.$elem.height();a.nzOffset=a.$elem.offset();a.widthRatio=a.largeWidth/a.options.zoomLevel/a.nzWidth;a.heightRatio=a.largeHeight/a.options.zoomLevel/a.nzHeight;"window"==a.options.zoomType&&(a.zoomWindowStyle="overflow: hidden;background-position: 0px 0px;text-align:center;background-color: "+String(a.options.zoomWindowBgColour)+";width: "+String(a.options.zoomWindowWidth)+
"px;height: "+String(a.options.zoomWindowHeight)+"px;float: left;background-size: "+a.largeWidth/a.options.zoomLevel+"px "+a.largeHeight/a.options.zoomLevel+"px;display: none;z-index:100px;border: "+String(a.options.borderSize)+"px solid "+a.options.borderColour+";background-repeat: no-repeat;position: absolute;");"inner"==a.options.zoomType&&(a.zoomWindowStyle="overflow: hidden;background-position: 0px 0px;width: "+String(a.nzWidth)+"px;height: "+String(a.nzHeight)+"px;float: left;display: none;cursor:"+
a.options.cursor+";px solid "+a.options.borderColour+";background-repeat: no-repeat;position: absolute;");"window"==a.options.zoomType&&(lensHeight=a.nzHeight<a.options.zoomWindowWidth/a.widthRatio?a.nzHeight:String(a.options.zoomWindowHeight/a.heightRatio),lensWidth=a.largeWidth<a.options.zoomWindowWidth?a.nzWidth:a.options.zoomWindowWidth/a.widthRatio,a.lensStyle="background-position: 0px 0px;width: "+String(a.options.zoomWindowWidth/a.widthRatio)+"px;height: "+String(a.options.zoomWindowHeight/
a.heightRatio)+"px;float: right;display: none;overflow: hidden;z-index: 999;-webkit-transform: translateZ(0);opacity:"+a.options.lensOpacity+";filter: alpha(opacity = "+100*a.options.lensOpacity+"); zoom:1;width:"+lensWidth+"px;height:"+lensHeight+"px;background-color:"+a.options.lensColour+";cursor:"+a.options.cursor+";border: "+a.options.lensBorderSize+"px solid "+a.options.lensBorderColour+";background-repeat: no-repeat;position: absolute;");a.tintStyle="display: block;position: absolute;background-color: "+
a.options.tintColour+";filter:alpha(opacity=0);opacity: 0;width: "+a.nzWidth+"px;height: "+a.nzHeight+"px;";a.lensRound="";"lens"==a.options.zoomType&&(a.lensStyle="background-position: 0px 0px;float: left;display: none;border: "+String(a.options.borderSize)+"px solid "+a.options.borderColour+";width:"+String(a.options.lensSize)+"px;height:"+String(a.options.lensSize)+"px;background-repeat: no-repeat;position: absolute;");"round"==a.options.lensShape&&(a.lensRound="border-top-left-radius: "+String(a.options.lensSize/
2+a.options.borderSize)+"px;border-top-right-radius: "+String(a.options.lensSize/2+a.options.borderSize)+"px;border-bottom-left-radius: "+String(a.options.lensSize/2+a.options.borderSize)+"px;border-bottom-right-radius: "+String(a.options.lensSize/2+a.options.borderSize)+"px;");a.zoomContainer=d('<div class="zoomContainer" style="-webkit-transform: translateZ(0);position:absolute;left:'+a.nzOffset.left+"px;top:"+a.nzOffset.top+"px;height:"+a.nzHeight+"px;width:"+a.nzWidth+'px;"></div>');d("body").append(a.zoomContainer);
a.options.containLensZoom&&"lens"==a.options.zoomType&&a.zoomContainer.css("overflow","hidden");"inner"!=a.options.zoomType&&(a.zoomLens=d("<div class='zoomLens' style='"+a.lensStyle+a.lensRound+"'>&nbsp;</div>").appendTo(a.zoomContainer).click(function(){a.$elem.trigger("click")}));a.options.tint&&(a.tintContainer=d("<div/>").addClass("tintContainer"),a.zoomTint=d("<div class='zoomTint' style='"+a.tintStyle+"'></div>"),a.zoomLens.wrap(a.tintContainer),a.zoomTintcss=a.zoomLens.after(a.zoomTint),a.zoomTintImage=
d('<img style="position: absolute; left: 0px; top: 0px; max-width: none; width: '+a.nzWidth+"px; height: "+a.nzHeight+'px;" src="'+a.imageSrc+'">').appendTo(a.zoomLens).click(function(){a.$elem.trigger("click")}));a.zoomWindow=isNaN(a.options.zoomWindowPosition)?d("<div style='z-index:999;left:"+a.windowOffsetLeft+"px;top:"+a.windowOffsetTop+"px;"+a.zoomWindowStyle+"' class='zoomWindow'>&nbsp;</div>").appendTo("body").click(function(){a.$elem.trigger("click")}):d("<div style='z-index:999;left:"+a.windowOffsetLeft+
"px;top:"+a.windowOffsetTop+"px;"+a.zoomWindowStyle+"' class='zoomWindow'>&nbsp;</div>").appendTo(a.zoomContainer).click(function(){a.$elem.trigger("click")});a.zoomWindowContainer=d("<div/>").addClass("zoomWindowContainer").css("width",a.options.zoomWindowWidth);a.zoomWindow.wrap(a.zoomWindowContainer);"lens"==a.options.zoomType&&a.zoomLens.css({backgroundImage:"url('"+a.imageSrc+"')"});"window"==a.options.zoomType&&a.zoomWindow.css({backgroundImage:"url('"+a.imageSrc+"')"});"inner"==a.options.zoomType&&
a.zoomWindow.css({backgroundImage:"url('"+a.imageSrc+"')"});a.$elem.bind("touchmove",function(b){b.preventDefault();a.setPosition(b.originalEvent.touches[0]||b.originalEvent.changedTouches[0])});a.zoomContainer.bind("touchmove",function(b){"inner"==a.options.zoomType&&(a.options.zoomWindowFadeIn?a.zoomWindow.stop(!0,!0).fadeIn(a.options.zoomWindowFadeIn):a.zoomWindow.show());b.preventDefault();a.setPosition(b.originalEvent.touches[0]||b.originalEvent.changedTouches[0])});a.zoomContainer.bind("touchend",
function(){a.zoomWindow.hide();a.options.showLens&&a.zoomLens.hide();a.options.tint&&a.zoomTint.hide()});a.$elem.bind("touchend",function(){a.zoomWindow.hide();a.options.showLens&&a.zoomLens.hide();a.options.tint&&a.zoomTint.hide()});a.options.showLens&&(a.zoomLens.bind("touchmove",function(b){b.preventDefault();a.setPosition(b.originalEvent.touches[0]||b.originalEvent.changedTouches[0])}),a.zoomLens.bind("touchend",function(){a.zoomWindow.hide();a.options.showLens&&a.zoomLens.hide();a.options.tint&&
a.zoomTint.hide()}));a.$elem.bind("mousemove",function(b){(a.lastX!==b.clientX||a.lastY!==b.clientY)&&a.setPosition(b);a.lastX=b.clientX;a.lastY=b.clientY});a.zoomContainer.bind("mousemove",function(b){(a.lastX!==b.clientX||a.lastY!==b.clientY)&&a.setPosition(b);a.lastX=b.clientX;a.lastY=b.clientY});"inner"!=a.options.zoomType&&a.zoomLens.bind("mousemove",function(b){(a.lastX!==b.clientX||a.lastY!==b.clientY)&&a.setPosition(b);a.lastX=b.clientX;a.lastY=b.clientY});a.options.tint&&a.zoomTint.bind("mousemove",
function(b){(a.lastX!==b.clientX||a.lastY!==b.clientY)&&a.setPosition(b);a.lastX=b.clientX;a.lastY=b.clientY});"inner"==a.options.zoomType&&a.zoomWindow.bind("mousemove",function(b){(a.lastX!==b.clientX||a.lastY!==b.clientY)&&a.setPosition(b);a.lastX=b.clientX;a.lastY=b.clientY});a.zoomContainer.mouseenter(function(){"inner"==a.options.zoomType&&(a.options.zoomWindowFadeIn?a.zoomWindow.stop(!0,!0).fadeIn(a.options.zoomWindowFadeIn):a.zoomWindow.show());"window"==a.options.zoomType&&(a.options.zoomWindowFadeIn?
a.zoomWindow.stop(!0,!0).fadeIn(a.options.zoomWindowFadeIn):a.zoomWindow.show());a.options.showLens&&(a.options.lensFadeIn?a.zoomLens.stop(!0,!0).fadeIn(a.options.lensFadeIn):a.zoomLens.show());a.options.tint&&(a.options.zoomTintFadeIn?a.zoomTint.stop(!0,!0).fadeIn(a.options.zoomTintFadeIn):a.zoomTint.show())}).mouseleave(function(){a.zoomWindow.hide();a.options.showLens&&a.zoomLens.hide();a.options.tint&&a.zoomTint.hide()});a.$elem.mouseenter(function(){"inner"==a.options.zoomType&&(a.options.zoomWindowFadeIn?
a.zoomWindow.stop(!0,!0).fadeIn(a.options.zoomWindowFadeIn):a.zoomWindow.show());"window"==a.options.zoomType&&(a.options.zoomWindowFadeIn?a.zoomWindow.stop(!0,!0).fadeIn(a.options.zoomWindowFadeIn):a.zoomWindow.show());a.options.showLens&&(a.options.lensFadeIn?a.zoomLens.stop(!0,!0).fadeIn(a.options.lensFadeIn):a.zoomLens.show());a.options.tint&&(a.options.zoomTintFadeIn?a.zoomTint.stop(!0,!0).fadeIn(a.options.zoomTintFadeIn):a.zoomTint.show())}).mouseleave(function(){a.zoomWindow.hide();a.options.showLens&&
a.zoomLens.hide();a.options.tint&&a.zoomTint.hide()});"inner"!=a.options.zoomType&&a.zoomLens.mouseenter(function(){"inner"==a.options.zoomType&&(a.options.zoomWindowFadeIn?a.zoomWindow.stop(!0,!0).fadeIn(a.options.zoomWindowFadeIn):a.zoomWindow.show());"window"==a.options.zoomType&&a.zoomWindow.show();a.options.showLens&&a.zoomLens.show();a.options.tint&&a.zoomTint.show()}).mouseleave(function(){a.options.zoomWindowFadeOut?a.zoomWindow.stop(!0,!0).fadeOut(a.options.zoomWindowFadeOut):a.zoomWindow.hide();
"inner"!=a.options.zoomType&&a.zoomLens.hide();a.options.tint&&a.zoomTint.hide()});a.options.tint&&a.zoomTint.mouseenter(function(){"inner"==a.options.zoomType&&a.zoomWindow.show();"window"==a.options.zoomType&&a.zoomWindow.show();a.options.showLens&&a.zoomLens.show();a.zoomTint.show()}).mouseleave(function(){a.zoomWindow.hide();"inner"!=a.options.zoomType&&a.zoomLens.hide();a.zoomTint.hide()});"inner"==a.options.zoomType&&a.zoomWindow.mouseenter(function(){"inner"==a.options.zoomType&&a.zoomWindow.show();
"window"==a.options.zoomType&&a.zoomWindow.show();a.options.showLens&&a.zoomLens.show()}).mouseleave(function(){a.options.zoomWindowFadeOut?a.zoomWindow.stop(!0,!0).fadeOut(a.options.zoomWindowFadeOut):a.zoomWindow.hide();"inner"!=a.options.zoomType&&a.zoomLens.hide()})},setPosition:function(a){this.nzHeight=this.$elem.height();this.nzWidth=this.$elem.width();this.nzOffset=this.$elem.offset();this.options.tint&&(this.zoomTint.css({top:0}),this.zoomTint.css({left:0}));this.options.responsive&&(lensHeight=
this.nzHeight<this.options.zoomWindowWidth/this.widthRatio?this.nzHeight:String(this.options.zoomWindowHeight/this.heightRatio),lensWidth=this.largeWidth<this.options.zoomWindowWidth?this.nzHWidth:this.options.zoomWindowWidth/this.widthRatio,this.widthRatio=this.largeWidth/this.nzWidth,this.heightRatio=this.largeHeight/this.nzHeight,this.zoomLens.css({width:String(this.options.zoomWindowWidth/this.widthRatio)+"px",height:String(this.options.zoomWindowHeight/this.heightRatio)+"px"}));this.zoomContainer.css({top:this.nzOffset.top});
this.zoomContainer.css({left:this.nzOffset.left});this.mouseLeft=parseInt(a.pageX-this.nzOffset.left);this.mouseTop=parseInt(a.pageY-this.nzOffset.top);"window"==this.options.zoomType&&(this.Etoppos=this.mouseTop<this.zoomLens.height()/2,this.Eboppos=this.mouseTop>this.nzHeight-this.zoomLens.height()/2-2*this.options.lensBorderSize,this.Eloppos=this.mouseLeft<0+this.zoomLens.width()/2,this.Eroppos=this.mouseLeft>this.nzWidth-this.zoomLens.width()/2-2*this.options.lensBorderSize);"inner"==this.options.zoomType&&
(this.Etoppos=this.mouseTop<this.nzHeight/2/this.heightRatio,this.Eboppos=this.mouseTop>this.nzHeight-this.nzHeight/2/this.heightRatio,this.Eloppos=this.mouseLeft<0+this.nzWidth/2/this.widthRatio,this.Eroppos=this.mouseLeft>this.nzWidth-this.nzWidth/2/this.widthRatio-2*this.options.lensBorderSize);0>this.mouseLeft||0>=this.mouseTop||this.mouseLeft>this.nzWidth||this.mouseTop>this.nzHeight?(this.zoomWindow.hide(),this.options.showLens&&this.zoomLens.hide(),this.options.tint&&this.zoomTint.hide()):
("window"==this.options.zoomType&&this.zoomWindow.show(),this.options.tint&&this.zoomTint.show(),this.options.showLens&&(this.zoomLens.show(),this.lensLeftPos=String(this.mouseLeft-this.zoomLens.width()/2),this.lensTopPos=String(this.mouseTop-this.zoomLens.height()/2)),this.Etoppos&&(this.lensTopPos=0),this.Eloppos&&(this.tintpos=this.lensLeftPos=this.windowLeftPos=0),"window"==this.options.zoomType&&(this.Eboppos&&(this.lensTopPos=Math.max(this.nzHeight-this.zoomLens.height()-2*this.options.lensBorderSize,
0)),this.Eroppos&&(this.lensLeftPos=this.nzWidth-this.zoomLens.width()-2*this.options.lensBorderSize)),"inner"==this.options.zoomType&&(this.Eboppos&&(this.lensTopPos=Math.max(this.nzHeight-2*this.options.lensBorderSize,0)),this.Eroppos&&(this.lensLeftPos=this.nzWidth-this.nzWidth-2*this.options.lensBorderSize)),"lens"==this.options.zoomType&&(this.windowLeftPos=String(-1*((a.pageX-this.nzOffset.left)*this.widthRatio-this.zoomLens.width()/2)),this.windowTopPos=String(-1*((a.pageY-this.nzOffset.top)*
this.heightRatio-this.zoomLens.height()/2)),this.zoomLens.css({backgroundPosition:this.windowLeftPos+"px "+this.windowTopPos+"px"}),this.setWindowPostition(a)),this.options.tint&&this.setTintPosition(a),"window"==this.options.zoomType&&this.setWindowPostition(a),"inner"==this.options.zoomType&&this.setWindowPostition(a),this.options.showLens&&this.zoomLens.css({left:this.lensLeftPos+"px",top:this.lensTopPos+"px"}))},setLensPostition:function(){},setWindowPostition:function(a){var b=this;if(isNaN(b.options.zoomWindowPosition))b.externalContainer=
d("#"+b.options.zoomWindowPosition),b.externalContainerWidth=b.externalContainer.width(),b.externalContainerHeight=b.externalContainer.height(),b.externalContainerOffset=b.externalContainer.offset(),b.windowOffsetTop=b.externalContainerOffset.top,b.windowOffsetLeft=b.externalContainerOffset.left;else switch(b.options.zoomWindowPosition){case 1:b.windowOffsetTop=b.options.zoomWindowOffety;b.windowOffsetLeft=+b.nzWidth;break;case 2:b.options.zoomWindowHeight>b.nzHeight&&(b.windowOffsetTop=-1*(b.options.zoomWindowHeight/
2-b.nzHeight/2),b.windowOffsetLeft=b.nzWidth);break;case 3:b.windowOffsetTop=b.nzHeight-b.zoomWindow.height()-2*b.options.borderSize;b.windowOffsetLeft=b.nzWidth;break;case 4:b.windowOffsetTop=b.nzHeight;b.windowOffsetLeft=b.nzWidth;break;case 5:b.windowOffsetTop=b.nzHeight;b.windowOffsetLeft=b.nzWidth-b.zoomWindow.width()-2*b.options.borderSize;break;case 6:b.options.zoomWindowHeight>b.nzHeight&&(b.windowOffsetTop=b.nzHeight,b.windowOffsetLeft=-1*(b.options.zoomWindowWidth/2-b.nzWidth/2+2*b.options.borderSize));
break;case 7:b.windowOffsetTop=b.nzHeight;b.windowOffsetLeft=0;break;case 8:b.windowOffsetTop=b.nzHeight;b.windowOffsetLeft=-1*(b.zoomWindow.width()+2*b.options.borderSize);break;case 9:b.windowOffsetTop=b.nzHeight-b.zoomWindow.height()-2*b.options.borderSize;b.windowOffsetLeft=-1*(b.zoomWindow.width()+2*b.options.borderSize);break;case 10:b.options.zoomWindowHeight>b.nzHeight&&(b.windowOffsetTop=-1*(b.options.zoomWindowHeight/2-b.nzHeight/2),b.windowOffsetLeft=-1*(b.zoomWindow.width()+2*b.options.borderSize));
break;case 11:b.windowOffsetTop=b.options.zoomWindowOffety;b.windowOffsetLeft=-1*(b.zoomWindow.width()+2*b.options.borderSize);break;case 12:b.windowOffsetTop=-1*(b.zoomWindow.height()+2*b.options.borderSize);b.windowOffsetLeft=-1*(b.zoomWindow.width()+2*b.options.borderSize);break;case 13:b.windowOffsetTop=-1*(b.zoomWindow.height()+2*b.options.borderSize);b.windowOffsetLeft=0;break;case 14:b.options.zoomWindowHeight>b.nzHeight&&(b.windowOffsetTop=-1*(b.zoomWindow.height()+2*b.options.borderSize),
b.windowOffsetLeft=-1*(b.options.zoomWindowWidth/2-b.nzWidth/2+2*b.options.borderSize));break;case 15:b.windowOffsetTop=-1*(b.zoomWindow.height()+2*b.options.borderSize);b.windowOffsetLeft=b.nzWidth-b.zoomWindow.width()-2*b.options.borderSize;break;case 16:b.windowOffsetTop=-1*(b.zoomWindow.height()+2*b.options.borderSize);b.windowOffsetLeft=b.nzWidth;break;default:b.windowOffsetTop=b.options.zoomWindowOffety,b.windowOffsetLeft=b.nzWidth}b.windowOffsetTop+=b.options.zoomWindowOffety;b.windowOffsetLeft+=
b.options.zoomWindowOffetx;b.zoomWindow.css({top:b.windowOffsetTop});b.zoomWindow.css({left:b.windowOffsetLeft});"inner"==b.options.zoomType&&(b.zoomWindow.css({top:0}),b.zoomWindow.css({left:0}));b.windowLeftPos=String(-1*((a.pageX-b.nzOffset.left)*b.widthRatio-b.zoomWindow.width()/2));b.windowTopPos=String(-1*((a.pageY-b.nzOffset.top)*b.heightRatio-b.zoomWindow.height()/2));b.Etoppos&&(b.windowTopPos=0);b.Eloppos&&(b.windowLeftPos=0);b.Eboppos&&(b.windowTopPos=-1*(b.largeHeight/b.options.zoomLevel-
b.zoomWindow.height()));b.Eroppos&&(b.windowLeftPos=-1*(b.largeWidth/b.options.zoomLevel-b.zoomWindow.width()));if("window"==b.options.zoomType||"inner"==b.options.zoomType)1>=b.widthRatio&&(b.windowLeftPos=0),1>=b.heightRatio&&(b.windowTopPos=0),b.largeHeight<b.options.zoomWindowHeight&&(b.windowTopPos=0),b.largeWidth<b.options.zoomWindowWidth&&(b.windowLeftPos=0),b.options.easing?(b.xp||(b.xp=0),b.yp||(b.yp=0),b.loop||(b.loop=setInterval(function(){b.xp+=(b.windowLeftPos-b.xp)/b.options.easingAmount;
b.yp+=(b.windowTopPos-b.yp)/b.options.easingAmount;b.zoomWindow.css({backgroundPosition:b.xp+"px "+b.yp+"px"})},16))):b.zoomWindow.css({backgroundPosition:b.windowLeftPos+"px "+b.windowTopPos+"px"})},setTintPosition:function(a){this.nzOffset=this.$elem.offset();this.tintpos=String(-1*(a.pageX-this.nzOffset.left-this.zoomLens.width()/2));this.tintposy=String(-1*(a.pageY-this.nzOffset.top-this.zoomLens.height()/2));this.Etoppos&&(this.tintposy=0);this.Eloppos&&(this.tintpos=0);this.Eboppos&&(this.tintposy=
-1*(this.nzHeight-this.zoomLens.height()-2*this.options.lensBorderSize));this.Eroppos&&(this.tintpos=-1*(this.nzWidth-this.zoomLens.width()-2*this.options.lensBorderSize));this.options.tint&&(this.zoomTint.css({opacity:this.options.tintOpacity}).animate().fadeIn("slow"),this.zoomTintImage.css({left:this.tintpos-this.options.lensBorderSize+"px"}),this.zoomTintImage.css({top:this.tintposy-this.options.lensBorderSize+"px"}))},swaptheimage:function(a,b){var c=this,d=new Image;c.options.onImageSwap(c.$elem);
d.onload=function(){c.largeWidth=d.width;c.largeHeight=d.height;c.zoomImage=b;c.zoomWindow.css({"background-size":c.largeWidth+"px "+c.largeHeight+"px"});c.swapAction(a,b)};d.src=b},swapAction:function(a,b){var c=this,d=new Image;d.onload=function(){c.nzHeight=d.height;c.nzWidth=d.width;c.options.onImageSwapComplete(c.$elem);c.doneCallback()};d.src=a;c.zoomWindow.css({backgroundImage:"url('"+b+"')"});c.currentImage=b;c.$elem.attr("src",a)},doneCallback:function(){this.options.tint&&(this.zoomTintImage.attr("src",
largeimage),this.zoomTintImage.attr("height",this.$elem.height()),this.zoomTintImage.css({height:this.$elem.height()}),this.zoomTint.css({height:this.$elem.height()}));this.nzOffset=this.$elem.offset();this.nzWidth=this.$elem.width();this.nzHeight=this.$elem.height();this.widthRatio=this.largeWidth/this.nzWidth;this.heightRatio=this.largeHeight/this.nzHeight;lensHeight=this.nzHeight<this.options.zoomWindowWidth/this.widthRatio?this.nzHeight:String(this.options.zoomWindowHeight/this.heightRatio);lensWidth=
this.largeWidth<this.options.zoomWindowWidth?this.nzHWidth:this.options.zoomWindowWidth/this.widthRatio;this.zoomLens&&(this.zoomLens.css("width",lensWidth),this.zoomLens.css("height",lensHeight))},getCurrentImage:function(){return this.zoomImage},getGalleryList:function(){var a=this;a.gallerylist=[];a.options.gallery?d("#"+a.options.gallery+" a").each(function(){var b="";d(this).data("zoom-image")?b=d(this).data("zoom-image"):d(this).data("image")&&(b=d(this).data("image"));b==a.zoomImage?a.gallerylist.unshift({href:""+
b+"",title:d(this).find("img").attr("title")}):a.gallerylist.push({href:""+b+"",title:d(this).find("img").attr("title")})}):a.gallerylist.push({href:""+a.zoomImage+"",title:d(this).find("img").attr("title")});return a.gallerylist},changeZoomLevel:function(a){this.widthRatio=this.largeWidth/a/this.nzWidth;this.heightRatio=this.largeHeight/a/this.nzHeight;this.zoomWindow.css({"background-size":this.largeWidth/a+"px "+this.largeHeight/a+"px"});this.zoomLens.css({width:String(this.options.zoomWindowWidth/
this.widthRatio)+"px",height:String(this.options.zoomWindowHeight/this.heightRatio)+"px"});this.options.zoomLevel=a},closeAll:function(){self.zoomWindow&&self.zoomWindow.hide();self.zoomLens&&self.zoomLens.hide();self.zoomTint&&self.zoomTint.hide()}};d.fn.elevateZoom=function(a){return this.each(function(){var b=Object.create(e);b.init(a,this);d.data(this,"elevateZoom",b)})};d.fn.elevateZoom.options={zoomLevel:1,easing:!1,easingAmount:12,lensSize:200,zoomWindowWidth:400,zoomWindowHeight:400,zoomWindowOffetx:0,
zoomWindowOffety:0,zoomWindowPosition:1,zoomWindowBgColour:"#fff",lensFadeIn:!1,lensFadeOut:!1,debug:!1,zoomWindowFadeIn:!1,zoomWindowFadeOut:!1,zoomWindowAlwaysShow:!1,zoomTintFadeIn:!1,zoomTintFadeOut:!1,borderSize:4,showLens:!0,borderColour:"#888",lensBorderSize:1,lensBorderColour:"#000",lensShape:"square",zoomType:"window",containLensZoom:!1,lensColour:"white",lensOpacity:0.4,lenszoom:!1,tint:!1,tintColour:"#333",tintOpacity:0.4,gallery:!1,galleryActiveClass:"zoomGalleryActive",cursor:"default",
responsive:!1,onComplete:d.noop,onZoomedImageLoaded:function(){},onImageSwap:d.noop,onImageSwapComplete:d.noop}})(jQuery,window,document);




For Sample Images Testing

I will post the images also

1.Small Image





2.Large Image


Read More »
No comments:
Subscribe to: Posts (Atom)