why my object is behind another object and also disappear when dragging around like this
as you can see the item or draggable object is always behind the second one, also behind all panel like this 
this is my draggabe script :
public event Action<PointerEventData> OnBeginDragHandler; public event Action<PointerEventData> OnDragHandler; public event Action<PointerEventData, bool> OnEndDragHandler; public bool FollowCursor { get; set; } = true; public Vector3 StartPosition; public bool CanDrag { get; set; } = true; private Color backgroundColor; [SerializeField] private Image backgroundImage; public RectTransform rectTransform; public Canvas canvas; private void Start() { rectTransform = GetComponent<RectTransform>(); canvas = FindObjectOfType<Canvas>(); backgroundImage = GetComponentInChildren<Image>(); backgroundColor = backgroundImage.color; } public void OnBeginDrag(PointerEventData eventData) { backgroundColor.a = .4f; backgroundImage.color = backgroundColor; if (!CanDrag) { return; } OnBeginDragHandler?.Invoke(eventData); } public void OnDrag(PointerEventData eventData) { backgroundColor.a = 1f; if (!CanDrag) { return; } OnDragHandler?.Invoke(eventData); if (FollowCursor) { rectTransform.anchoredPosition += eventData.delta / canvas.scaleFactor; } } public void OnEndDrag(PointerEventData eventData) { backgroundColor.a = 1f; backgroundImage.color = backgroundColor; if (!CanDrag) { return; } var results = new List<RaycastResult>(); EventSystem.current.RaycastAll(eventData, results); _DropArea dropArea = null; foreach (var result in results) { dropArea = result.gameObject.GetComponent<_DropArea>(); if (dropArea != null) { break; } } if (dropArea != null) { if (dropArea.Accept(this)) { dropArea.Drop(this); OnEndDragHandler?.Invoke(eventData, true); return; } } rectTransform.anchoredPosition = StartPosition; OnEndDragHandler?.Invoke(eventData, false); } public void OnInitializePotentialDrag(PointerEventData eventData) { StartPosition = rectTransform.anchoredPosition; rectTransform.SetAsFirstSibling(); } 