How to scroll WebView horizontally inside ViewPager2

I tried to implement view pager with webView as recycler view item.

I can populate the view correctly, but it lead to weird behavior, here some things I noticed:

1)In the webView there is top navigation bar, that I need to scroll horizontally in order to see all the items. It does not working, just skip to the next page in the list.

2)the vertical scrolling does not smooth at all, if I'm not scrolling in completely stright line, It's acting like I want move to next page.

How can I solve this problems?

Fragment that hold the view pager:

class DetailFragment : Fragment() {



    private lateinit var binding: FragmentDetailDummyBinding

    private val args: DetailFragmentArgs by navArgs()


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        // Inflate the layout for this fragment
        return FragmentDetailDummyBinding.inflate(inflater, container, false).apply {
            binding = this
        }.root
    }

    @SuppressLint("SetJavaScriptEnabled")
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        Log.d(TAG, "onViewCreated: $args")
        binding.viewPager.adapter = WebviewPagerAdapter(args.urlList.toList())
    }
}

Adapter:

class WebviewPagerAdapter(
    val urlList: List<String>
) : RecyclerView.Adapter<WebviewPagerAdapter.WebviewPagerViewHolder>() {


    override fun onCreateViewHolder(
        parent: ViewGroup,
        viewType: Int
    ): WebviewPagerViewHolder {
        val view = LayoutInflater.from(parent.context)
            .inflate(R.layout.fragment_detail, parent, false)
        return WebviewPagerViewHolder(view)
    }

    override fun getItemCount(): Int {
        return urlList.size
    }

    override fun onBindViewHolder(holder: WebviewPagerViewHolder, position: Int) {
        val url = urlList[position]
        holder.bind(url )
    }

    class WebviewPagerViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        @SuppressLint("SetJavaScriptEnabled")
        fun bind(url: String) {
            itemView.webView.apply {
                webViewClient = WebViewClient()
                settings.javaScriptEnabled = true
                loadUrl(url)
            }
        }

    }

}

There are some questions on this topic in stackoverflow but they all very old so I'm not sure if the answers are still correct