The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.
 
 
Thread Tools Display Modes
Prev Previous Post   Next Post Next
  #1  
Old 08-07-2019, 12:13 AM
Rowan Henseleit1's Avatar
Rowan Henseleit1 Rowan Henseleit1 is offline
Junior Member
 
Join Date: Aug 2019
Posts: 5
Default Shopping Cart Widget

Hi,

I am looking to have a custom shopping cart widget using an image I have made. I would prefer to do this using the simple method you have already provided with the

HTML Code:
data-custom-icon-url="img/Icons/CartIcon.png"
css code however my site has custom JS meaning this needs to be able to be dragged and not have a 'ghost image' which is normally fixed by putting

draggable="false" in the <img> holder.

My JavaScript can be found here

HTML Code:
<script type="text/javascript">
		dragElement(document.getElementById(("Icon")));

	function dragElement(elmnt) {
	  var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
	  if (document.getElementById(elmnt.id + "drag")) {
	    /* if present, the header is where you move the DIV from:*/
	    document.getElementById(elmnt.id + "drag").onmousedown = dragMouseDown;
	  } else {
	    /* otherwise, move the DIV from anywhere inside the DIV:*/
	    elmnt.onmousedown = dragMouseDown;
	  }

	  function dragMouseDown(e) {
	    e = e || window.event;
	    // get the mouse cursor position at startup:
	    pos3 = e.clientX;
	    pos4 = e.clientY;
	    document.onmouseup = closeDragElement;
	    // call a function whenever the cursor moves:
	    document.onmousemove = elementDrag;
	  }

	  function elementDrag(e) {
	    e = e || window.event;
	    // calculate the new cursor position:
	    pos1 = pos3 - e.clientX;
	    pos2 = pos4 - e.clientY;
	    pos3 = e.clientX;
	    pos4 = e.clientY;
	    // set the element's new position:
	    elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
	    elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
	  }

	  function closeDragElement() {
	    /* stop moving when mouse button is released:*/
	    document.onmouseup = null;
	    document.onmousemove = null;
	  }
	}
</script>
I have tried using developer tools to get appropriate class names and also searched for people trying to do similar things but none of the fixes work for me.

I would also like to know how to remove the item number counter which comes up on the widget when an item is added to the bag.



Thanks,
Rowan
 
The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.

Tags
cart, css, javascript, widget

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 10:55 AM.
Powered by vBulletin® Version 3.8.11. Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.