Comments by Hussain Javed (Top 70 by date)

by using this code i am able to store only one book id in database,how to save multiple book id's in database.

i want to return value of total books allocated to particular class.that value i want to return to view.and i want to compare that value with total items in listbox control count value.in Add function.

i dont know to make ajax call to action method,can you please help me
how to call controller action method and pick up that int value and use that value in add function of view

how can i send you my screen shot image to you

for example,any book name is there is text box and add button is there
on click of add button the book name is should added to listbox

I want to add books to list box by click each book which i get from pop up box
the text box value is book name that name will add to list box on click of add button

first it checks if any fee.count() is there,else it allocates fee.otherwise there is feeallocation_id is there then it should be updated
else
{
string str = "Update Student_Fee_Allocation Set Consession='" + studentfeedatal.Concession + "',Final_Amount='" + studentfeedatal.Final_Amount + "' Where Fee_Allocation_Id='" + studentfeedatal.Fee_Allocation_Id + "'";
var result = db.ExecuteStoreCommand(str);
db.SaveChanges();
}

[HttpPost]
public ActionResult Index(CUSTOM_STUDENT_FEEALLOCTION_DATA CUSTOM_STUDENT_FEEALLOCTION_DATAObj)
{

var Student_FeeallocationDetail = CUSTOM_STUDENT_FEEALLOCTION_DATAObj.CUSTOM_STUDENT_FEEALLOCATION_DETAIL;
var SelectStufeedetail = Student_FeeallocationDetail.Where(b => b.SELECTED_STUDENT == true).ToList();

CUSTOM_STU_DETAIL stuentdetail = new CUSTOM_STU_DETAIL();
try
{
foreach (var studentfeedatal in SelectStufeedetail)
{
if (studentfeedatal.Registration_Id == null)
{
List<studentregdetail> regIdObj = new List<studentregdetail>();

regIdObj = (from r in db.Student_Registration
join ra in db.Student_Re_Admission on r.Registration_Id equals ra.Registration_Id
join c in db.Student_Fee_Allocation on r.Registration_Id equals c.Fee_Allocation_Id
where r.Academic_Year_Id== studentfeedatal.Academic_Year_Id && r.Class_Id==studentfeedatal.Class_Id
where ra.Promoted==false

select new StudentRegDetail()
{
Registration_Id = r.Registration_Id,
Admission_No = ra.Admission_No,
Fee_Allocation_Id = c.Fee_Allocation_Id
}).OrderBy(a => a.Registration_Id).ToList();

foreach (var regIds in regIdObj)
{
var fee_set = db.Student_Fee_Allocation.Where(a => a.Fee_Master_Id == studentfeedatal.Fee_Master_Id && a.Registration_Id == regIds.Registration_Id).ToList();
if (fee_set.Count == 0)
{
Student_Fee_Allocation Student_Fee_AlloctionObj = new Student_Fee_Allocation();
Student_Fee_AlloctionObj.Last_Updated_Date = DateTime.Now.ToUniversalTime();
Student_Fee_AlloctionObj.Last_Updated_By = CurrentUserID;
Student_Fee_AlloctionObj.Creation_Date = DateTime.Now.ToUniversalTime();
Student_Fee_AlloctionObj.Created_By = CurrentUserID;

//Student_Fee_AlloctionObj.Fee_Allocation_Id = studentfeedatal.Fee_Allocation_Id;
Student_Fee_AlloctionObj.Academic_Year_Id = studentfeedatal.Academic_Year_Id;
Student_Fee_AlloctionObj.Class_Id = studentfeedatal.Class_Id;
Student_Fee_AlloctionObj.Admission_No = regIds.Admission_No.ToString();
Student_Fee_AlloctionObj.Registration_Id = regIds.Registration_Id;
Student_Fee_AlloctionObj.Fee_Master_Id = studentfeedatal.Fee_Master_Id;
Student_Fee_AlloctionObj.Fee_Period_Id = studentfeedatal.Fee_Period_Id;
Student_Fee_AlloctionObj.Amount = studentfeedatal.Amount;
Student_Fee_AlloctionObj.Consession = studentfeedatal.Concession;
Student_Fee_AlloctionObj.Final_Amount = studentfeedatal.Final_Amount;
Student_Fee_AlloctionObj.Paid_Amount = 0;
Student_Fee_AlloctionObj.Balance = studentfeedatal.Final_Amount;
Student_Fee_AlloctionObj.Delete_Flag = false;

db.Student_Fee_Allocation.AddObject(Student_Fee_AlloctionObj);
db.SaveChanges();


}

no button is there, on load it has to set default value.
I am passing id from front end and getting company name from database,i want to set default name to that drop down list

here is my view code
@model Model.Student_Registration
@using CloudPayroll.Helpers
@using Model.Models

@{
ViewBag.Title = "Create";
}

<script type="text/javascript">





var sel = document.getElementById('Company_ID');
sel.selectedIndex = 1;



$(function () {





$("#formID").validationEngine();

$("input:checkbox").live("click", function () {
if ($(this).is(":checked")) {
$(this).attr("value", "True");
} else {
$(this).attr("value", "False");
}
});
$("#btnCancel").live("click", function () {
$("#formID").validationEngine("hide");
});
$("#DATE_OF_BIRTH").datepicker({
changeDate: true,
changeMonth: true,
changeYear: true,
maxdate: new Date()
});
$("#DATE_OF_JOINING").datepicker({
changeDate: true,
changeMonth: true,
changeYear: true,
maxdate:new Date()
});
});

$(document).ready(function () {




$("#PHOTO").live("change", function (data) {
if (this.files && this.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#preview')
.attr('src', e.target.result)
.width(80)
.height(110);
};
reader.readAsDataURL(this.files[0]);
}
});

$('#PHOTO').live("change", function () {
var ext = $('#PHOTO').val().split('.').pop().toLowerCase();
if ($.inArray(ext, ['gif', 'png', 'jpg', 'jpeg']) == -1) {
alert('Invalid Image Format!');
}
});



//change event for the COUNTRY_ID combo
$("#COUNTRY_ID").live("change", function () {
var CountryID = $(this).attr("value");

var ListSt = $('#STATE_ID');
var ListCt = $('#CITY_ID');

ListSt.empty();
ListCt.empty();
ListSt.append('<option value="0">Select</option>');
ListCt.append('<option value="0">Select</option>');
//call get state method experience master controller to get state list according to the country selected
$.getJSON("/../EXPERIENCE_MASTER/GetStates?CountryID=" + CountryID, null, function (data) {
$.each(data, function (index, StateCC) {
ListSt.append($('<option/>', {
value: StateCC.STATE_ID,
text: StateCC.STATE_NAME
}));
});
});

});
//change event for the state combo
$("#STATE_ID").live("change", function () {
var StateId = $(this).attr("value");
var ListCt = $('#CITY_ID');
//same for storeing city in ListCT

ListCt.empty();
//here we emplt the list of city
ListCt.append('<option value="0">Select</option>');
//now append the value 0 and text select to the list of listct
$.getJSON("/../EXPERIENCE_MASTER/GetCities?StateId=" + StateId, null, function (data) {

$.each(data, function (index, CityCC) {
ListCt.append($('<option/>', {
value: CityCC.CITY_ID,
text: CityCC.CITY_NAME
}));
});
});


});
});

</script>

@*<div>
<table cellpadding="0" cellspacing="0" class="dyntable" width="100%" id="example">
<tr>
<td width="20%">
SCHOOL NAME
</td>
<td width="20%">@Html.DropDownList("Company_ID", (IEnumerable<SelectListItem>)ViewBag.Company_ID, "All", new { style = "width: 250px;", id = "Company_ID" })
</td>
</tr>

asp.net,
I am passing id from front end and getting company name from database,i want to set default name to that drop down list

I am passing id from front end and getting company name from database,i want to set default name to that drop down list

There is no such code in view,the controls get from database

how to set condition, In my table, In_time and Out_time columns are there if student in_time is stored in database that means he is present otherwise absent.
these result is stored in variables,i can display as output

how to set condition, In my table, In_time and Out_time columns are there if student in_time is stored in database that means he is present otherwise absent.

I want to display monthly attendance of each student.
I am passing two parameters one start date another end date.
In my table In_time and Out_time columns are there if student in_time is stored in database that means he is present otherwise absent.

If i hover on any li element the div contains another list of items,if mouseleave that element then that li element should not hidden.
If i hover another li element then first li element div should be hidden and second li element should be show.
for example you can see www.cloudingsystem.com

ok i have tried your function.Its Working.
If i hover on any li element the div contains another list of items,if mouseleave that element then that li element should not hidden.
If i hover another li element then first li element div should be hidden and second li element should be show.
for example you can see www.cloudingsystem.com

I have tried this but its not working
here is my code
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
ul {
list-style-type: none;
margin: 0;
padding: 0;
}

li {
display: inline;
}
.first:hover
{
background-color: red;
}
.second:hover
{
background-color: red;
}



</style>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.7.2.js"></script>
<script type="text/javascript">

$('#first').mouseenter(function(){
$('.div1').show();
});
$('#first').mouseleave(function(){
$('.div1').hide();
});

$('#second').mouseenter(function(){
$('.div2').show();
});
$('#second').mouseleave(function(){
$('.div2').hide();
});

</script>
</head>
<body>

<ul>
<li>Home</li>
<li id="first">News</li>
<li id="second">Contact</li>
<li>About</li>
</ul>
<div class="div1" style="Width:200px;height:150px;border:2px solid black;display:none;">asd</div>
<div class="div2" style="Width:200px;height:50px;border:2px solid black;display:none;">sgtargewarasd</div>
</body>
</html>

can you give any example for this problem

Have you seen my code

I have used drawImage method but it is not working
here is my code
<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="700" height="800"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var sticky = new Image();
sticky.src = "image.jpg";
context.beginPath();
context.moveTo(210, 150);
context.lineTo(230, 300);
context.stroke();
context.beginPath();
context.moveTo(390, 150);
context.lineTo(370, 300);
context.stroke();
context.beginPath();
context.moveTo(230, 300);
context.lineTo(370, 300);
context.stroke();
context.beginPath();
context.moveTo(210, 150);
context.lineTo(270, 150);
context.stroke();
context.beginPath();
context.moveTo(390, 150);
context.lineTo(330, 150);
context.stroke();
context.beginPath();
context.moveTo(270, 150);

context.bezierCurveTo(240,220, 360, 220, 330, 150);
context.stroke();
context.beginPath();
context.moveTo(210, 150);
context.lineTo(180, 500);
context.stroke();
context.beginPath();
context.moveTo(223, 250);
context.lineTo(200, 500);
context.stroke();



context.beginPath();
context.moveTo(390, 150);
context.lineTo(420, 500);
context.stroke();
context.beginPath();
context.moveTo(377, 250);
context.lineTo(400, 501);
context.stroke();
var test="image.jpg";
context.fillStyle = "test";



context.beginPath();
context.moveTo(230, 300);
context.lineTo(230, 501);
context.stroke();
context.beginPath();
context.moveTo(370, 300);
context.lineTo(375, 501);
context.stroke();
$( "#img1" ).click(function(){
context.drawImage(sticky, 0, 100);
});


</script>

<img src="image.jpg" id="img1" width="50" height="40"/>
</body>
</html>

have you seen my code

I have tried on example but it is not working
here is my code,please check once
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.7.1.js"></script>

<script type="text/javascript">
$(document).ready(function()){
$(".cont").onclick(function(){
$(this).toggleClass("rotator") ;
});
});
</script>
<style type="text/css">
.info, .image{
position:absolute;
-webkit-transition: -webkit-transform 1s , z-index 0s 0.25s;

}

.info{padding:10px;
width: 160px;
height: 160px;
z-index: -2;
-webkit-transform: rotateY(180deg);
background-color: rgba(255,255,255,0.8);

}

.image{
z-index: -1;
-webkit-transition: -webkit-transform 1s, z-index 0s 0.25s;
-webkit-transform: rotateY(0deg);
}

.rotator{

width:160px;
height: 160px;
}

.rotator .info{
-webkit-transition: -webkit-transform 1s, z-index 0s 0.25s;
z-index: -1;
-webkit-transform: rotateY(0deg);

}
.rotator .image{
-webkit-transform: rotateY(180deg);
-webkit-transition: -webkit-transform 1s, z-index 0s 0.25s;;
z-index: -2;
}</style>
</head>
<body>
<div class="cont">
<img class="image" src="image.jpg" width="50" height="40"/>
<div class="info"> hello welcome to elife</div>
</div></body>

</html>

i have tried ur code it is not getting
here is my code
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.js"></script>

<script type="text/javascript">
$('.f1_container').click(function() {
$(this).toggleClass('active');
});
</script>
<style type="text/css">
.f1_container {
position: relative;
margin:10px;
width: 450px;
height: 281px;
z-index : 1;
float:left;
}
.f1_container {
-webkit-perspective: 1000;
perspective: 1000;
}
.f1_card {
width: 100%;
height: 100%;
-webkit-transform-style: preserve-3d;
-webkit-transition: all 1.0s linear;
transform-style: preserve-3d;
transition: all 1.0s linear;
}
.f1_container.active .f1_card {
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
box-shadow: -5px 5px 5px #aaa;
}
.face {
position: absolute;
width: 100%;
height: 100%;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}
.face.back {
display: block;
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
box-sizing: border-box;
color: white;
text-align: center;
background-color: #aaa;
}
body{width:2000px}
</style>
</head>
<body>
<div class="f1_container">
<div class="shadow f1_card">
<div class="front face">
<img src="http://media-cdn.tripadvisor.com/media/photo-s/03/48/0b/14/dolphin-view-chalets.jpg" style="height:

281px; width: 450px;" />
</div>
<div class="back face center">Some text inside here</div>
</div>
</div>

<div class="f1_container">
<div class="shadow f1_card">
<div class="front face">
<img src="http://media-cdn.tripadvisor.com/media/photo-s/03/48/0b/14/dolphin-view-chalets.jpg" style="height:

281px; width: 450px;" />
</div>
<div class="back face center">Some text inside here</div>
</div>
</div>

<div class="f1_container">
<div class="shadow f1_card">
<div class="front face">
<img src="http://media-cdn.tripadvisor.com/media/photo-s/03/48/0b/14/dolphin-view-chalets.jpg" style="height:

281px; width: 450px;" />
</div>
<div class="back face center">Some text inside here</div>
</div>
</div>

<div class="f1_container">
<div class="shadow f1_card">
<div class="front face">
<img src="http://media-cdn.tripadvisor.com/media/photo-s/03/48/0b/14/dolphin-view-chalets.jpg" style="height:

281px; width: 450px;" />
</div>
<div class="back face center">Some text inside here</div>
</div>
</div>
</body>

</html>

what you have told i can't understand?

can you give any example for this, like it is in link
http://www.houseofblouse.com/design/u-neck-2

There is nothing similar to my project flip.there is no demo.have you seen my link

yes,but i have two images in div one small at top corner and one big.
once check this link
http://www.houseofblouse.com/design/u-neck-2

I want to do same as in that link,
please once check link
http://www.houseofblouse.com/design/u-neck-2

can you explain how he is changing only collar images,sleeve images separately.on that link select one full sleeve image under styles tab,and go to fabric tag and select any fabric image it changes sleeve color of big image.explain me or give any suggestion on this problem.
here is link
http://www.houseofblouse.com/design/u-neck-2

I want to design each part of human in separate divs and combine all divs,like hands in one div,head in one div,body part means collar part in one div,and remaining botton part in one div.
have u seen my link.

Hijri calender shows years as 1436,it is arabic

I am searching in google also it wont show any hijri datepicker plugin.

I have tried but not working.please check code i have send
It shows second popup.when i click ok button it will not closing.how to get second popup after first pop up
hereis my code
<html>
<head>
<script src="bootstrap.min.js" type="text/javascript"></script>

<link href="bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-2.1.3.js" type="text/javascript"></script>

<script type="text/javascript">
function showDialog2() {
$("#dialog1").removeClass("fade").modal("hide");
$("#dialog2").addClass("fade").modal("show");
}

$("#dialog1").modal("show");

$("#dialog-ok").on("click", function () {
showDialog2();
});

</script>
</head>
<body>
<div id="dialog1" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
Modal Dialog 1


</div>
<div class="modal-body">This is the first modal dialog</div>
<div class="modal-footer">
<button type="button" id="dialog-ok" class="btn btn-default">Show dialog 2</button>
<button type="button" id="dialog-close" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div id="dialog2" class="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
Modal Dialog 2


</div>
<div class="modal-body">This is the second modal dialog</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
</body>
</html>

I have tried but it not working.
I have tried another way by applying bootstrap.min.js file and bootstrap.min.css file and jquery 2.1.3 file.then it directly getting second pop up,and after clicking ok button it will not closing.how to get first pop up after second popup

Hello i am getting second popup,How to get first popup?
here is my code
<html>
<head>
<script src="bootstrap.min.js" type="text/javascript"></script>

<link href="bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-2.1.3.js" type="text/javascript"></script>

<script type="text/javascript">
function showDialog2() {
$("#dialog1").removeClass("fade").modal("hide");
$("#dialog2").addClass("fade").modal("show");
}

$("#dialog1").modal("show");

$("#dialog-ok").on("click", function () {
showDialog2();
});

</script>
</head>
<body>
<div id="dialog1" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

Modal Dialog 1

</div>
<div class="modal-body">This is the first modal dialog</div>
<div class="modal-footer">
<button type="button" id="dialog-ok" class="btn btn-default">Show dialog 2</button>
<button type="button" id="dialog-close" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div id="dialog2" class="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

Modal Dialog 2

</div>
<div class="modal-body">This is the second modal dialog</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
</body>
</html>

Have you seen my code

Here is the code
<html>
<head>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<style type="text/css" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"></style>
<style type="text/css" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"></style>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script>

<script type="text/javascript">
function showDialog2() {
$("#dialog1").removeClass("fade").modal("hide");
$("#dialog2").addClass("fade").modal("show");
}

$("#dialog1").modal("show");

$("#dialog-ok").on("click", function () {
showDialog2();
});

</script>
</head>
<body >


<div id="dialog1" class="modal fade" >
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

Modal Dialog 1

</div>
<div class="modal-body">This is the first modal dialog</div>
<div class="modal-footer">
<button type="button" id="dialog-ok" class="btn btn-default">Show dialog 2</button>
<button type="button" id="dialog-close" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div id="dialog2" class="modal" >
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

Modal Dialog 2

</div>
<div class="modal-body">This is the second modal dialog</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>

</body>
</html>

There no such code in css

even I include these two styles it was not coming why?

Any other files are need to include beyond that two files.for this

I am working in notepad.I am connected to internet.Here also this fiddle is working but when i apply this code in notepad it was not working.

Here is my code
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script type="text/javascript">
function showDialog2() {
$("#dialog1").removeClass("fade").modal("hide");
$("#dialog2").addClass("fade").modal("show");
}

$("#dialog1").modal("show");

$("#dialog-ok").on("click", function () {
showDialog2();
});
</script>
</head>
<body>
<div id="dialog1" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

Modal Dialog 1

</div>
<div class="modal-body">This is the first modal dialog</div>
<div class="modal-footer">
<button type="button" id="dialog-ok" class="btn btn-default">Show dialog 2</button>
<button type="button" id="dialog-close" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div id="dialog2" class="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

Modal Dialog 2

</div>
<div class="modal-body">This is the second modal dialog</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
</body>
</html>

No its not working. i have included this two files
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

I am not getting even after adding bootstrap js file

I have included that js file also

I have tried your code. it is not getting
here is my code
<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script type="text/javascript">
function showDialog2() {
$("#dialog1").removeClass("fade").modal("hide");
$("#dialog2").addClass("fade").modal("show");
}

$("#dialog1").modal("show");

$("#dialog-ok").on("click", function () {
showDialog2();
});
</script>
</head>
<body>
<div id="dialog1" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

Modal Dialog 1

</div>
<div class="modal-body">This is the first modal dialog</div>
<div class="modal-footer">
<button type="button" id="dialog-ok" class="btn btn-default">Show dialog

2</button>
<button type="button" id="dialog-close" class="btn btn-default" data-

dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div id="dialog2" class="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

Modal Dialog 2

</div>
<div class="modal-body">This is the second modal dialog</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-

dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
</body>
</html>

can you give any example pop up like in that website.

In that website popup there two buttons in popup.one is agree another is cancel.if we click agree another pop up is displayed which consists country names,if any country name is selected pop up is closed.if we clicked cancel button on first pop up then pop up is closed

i want to chane another image on click of one image
please refer
http://www.houseofblouse.com/design/u-neck-2[^]

this my function
function changeImage(){

document.getElementById('toChange').src='images/scrol v neck images/g.png';
document.getElementById('toChange1').src='images/scrol v neck images/g1.png';
document.getElementById('toChange2').src='images/scrol v neck images/g1.png';
document.getElementById('toChange3').src='images/scrol v neck images/g.png';
}
this is the image which i click
<div class="col-md-3" >
<img src="images/scrol v neck images/img1.png" style="width:120%;" />
<p style="text-align:center; padding-top:10px;"> Classic V </p>
</div>
this the div where image is changed
<div class="pad" >

<img src="images/scrol v neck images/g.png" class="vneck_imgbor img-responsive" id="toChange" style="padding-

left:60px;padding-right:50px;" />
<img class="front1" id="tochange2" src="images/scrol v neck images/g1.png" width="50" height="50">
</div>
</div>
<div class="back" style="width:300px;height:1600px;">
<div class="pad">
<img src="images/scrol v neck images/g1.png" class="vneck_imgbor img-responsive" id="toChange1" style="padding-

left:60px;padding-right:50px;" />
<img class="back1" id="tochange3" src="images/scrol v neck images/g.png" width="50" height="50">
</div>
</div>
big image is changing but small image is not changing.

please refer http://www.houseofblouse.com/design/u-neck-2
there is image in div onclick it show in popup

please refer http://www.houseofblouse.com/design/u-neck-2
there is image in div onclick it show in popup

can you give any working example for this?

i want to popup this image onclick using jquery or javascript
<div style="height:65px;border:solid 1px #999;">

<img src="images/startdesign images/img7.png" id="fabric" height="63" width="401"/>
</div>
can you give any working example for this

can you give any working example for this?

all div images are getting in vertically
and when i apply this
padding-top: 5px;
padding-bottom: 5px;
padding-right: 5px;
padding-left: 5px;
images are shaking

wrapper is class of all images?
I have updated the given wrapper class it will not showing any dotted border and pink border

I want padding between image and border on hover.as you see in that link
I have use
.abc:hover
{
border:1px solid pink;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 5px;
padding-left: 5px;
}

ok.I removed id to images and place class to images.i apply your code images are shaking
here is my applied code
.abc{
float:left;
border:1px solid transparent;
}
.abc:hover
{
border:2px solid pink;
}

i have done what you say but,I want dotted border to image.on hover i want pink border.
i change my code as
.abc:hover
{
border:1px solid pink;
padding-bottom: 2px;
padding-top: 2px;
padding-left: 2px;
padding-right: 2px;
}
again images are shake
please refer this link
http://www.houseofblouse.com/start-designing

<div id="popupdiv">
<div class="col-md-12" style="margin-top: 45px;"> <!--col-md-12 start-->
<div class="col-md-4 displayimg" id="xyz"> <!-- in col-12, 4cols start here -->
<div>
<div id="divzoom" style="cursor: pointer;">
<div id="mainpic" style="width:270px;height:500px; >
<span class="glyphicon glyphicon-zoom-in" aria-hidden="true">
<img id="ContentPlaceHolder1_imgMainImage" class="img-responsive"

src="images/designstyles/a.jpg" height="690" width="500"/></span>
</div>
</div>

</div>
</div> <!-- in col-12, 4cols end here -->
<div class="col-md-1 rtsmobthumb1" id="abc"> <!-- in col-12, 1cols start here -->
<br>
<div class="tn">

<img id="lkj" src="images/designstyles/a.jpg" class="img-responsive rts_img" height="60"

width="55" />



<img id="mno" src="images/designstyles/b.jpg" class="img-responsive rts_img" height="60"

width="55" />


<img id="ghi" src="images/designstyles/c.jpg" class="img-responsive rts_img" height="60"

width="55" />



<img id="pqr" src="images/designstyles/d.jpg" class="img-responsive rts_img" height="60"

width="55" />

</div>

</div> <!-- in col-12, 1cols end here -->
</div><!-- in div dialog -->
css for anchor tag
#close {
display: block;
position: absolute;
width:20px;
height:30px;
top:10px;
right: 30px;
background: url(images/designstyles/search.png);
background-size: 100% 100%;
background-repeat: no-repeat;
z-index: 100;
padding: 5px 2px 2px;
}

http://www.houseofblouse.com/media-kit
please see this page you will understand what i need. and if i click any of the image in that page the image will open in another page and observe the url of the page is like this
http://www.houseofblouse.com/images/mediakitimages/base-style-page-big.jpg

http://www.houseofblouse.com/media-kit
please see this page you will understand what i need. and if i click any of the image in that page the image will open in another page and observe the url of the page is like this
http://www.houseofblouse.com/images/mediakitimages/base-style-page-big.jpg